Flexible Squares - Arctic Rash
TITLE: Arctic Rash
STYLE: S2 Flexible Squares
ACCOUNT TYPES: Paid or Plus
CREDIT barubaron WITH USE
LIVE PREVIEW
Details & Notes:
[All Accounts] The layout is compatible with a navigation bar, but does not come customized. There is no sidebar included in this layout.
[Sponsored Accounts] It is recommended that your ad placement be set for 'between entries'.
I also included the CSS for custom subject icons. Instead of LJ's default 'locked' icon, or the golden friends group icon, you can substitute your own tiny icons. Just remember that the first two paddings -- padding: 16px 16px 0px 0px; -- are the HEIGHT and WIDTH of the icon. Of course, you don't have to use this -- and if you leave it blank LJ's default icons will appear. :)
INSTALLATION INSTRUCTIONS. PLEASE READ THEM.
/* Title: 'Arctic Rash' */
/* Created/Modified: May 2010 */
/* S2 Layout: Flexible Squares */
/* Account Types: Paid or Free */
/* Made by barubaron.livejournal.com */
/* DO NOT CLAIM AS YOUR OWN !! */
/* SPONSORED ACCOUNTS, IT IS RECOMMENDED
TO HAVE YOUR AD PLACEMENT SET FOR BETWEEN ENTRIES. */
/* LAYOUT INCLUDES CUSTOMIZED COMMENTS PAGE. */
/* CONTENT, BACKGROUND STUFF */
body {
background: #DEE7EB url('') repeat;
text-align: justify;
color: #545454;
letter-spacing: 0px;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 12px;
padding: 0px;
margin: 0px 0 0px 0;
line-height: 150%;
}
a, a:link, a:visited {
color: #8CB670;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
text-decoration: none;
}
a:hover {
cursor: help;
color: #E24040;
text-decoration: none;
}
blockquote {
font-size: 12px;
background-color: #FFFFF;
border-top: 3px #ADC2CD dashed;
border-left: 0px #E8E8E8 solid;
border-right: 0px #E8E8E8 solid;
border-bottom: 0px #E8E8E8 solid;
padding: 5px;
}
code, kbd, pre, tt, b, i {
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-color: #FFFFFF;
}
#content {
width: 80%;
margin-left: auto;
margin-right: auto;
margin-top: 40px;
margin-bottom: 20px;
background-color: #ADC2CD;
padding: 0px 0 0px 0;
}
#maincontent {
padding: 0px 0px 0px 0px;
margin: 0px 210px 0px 0px;
border-top: 0px #39A7C7 solid;
background-color: #FFFFFF;
}
#sidebar {
display: none;
}
#header {
padding: 10px 10px 10px 10px;
margin-bottom: -5px;
text-align: left;
font-style: none;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 12px;
text-transform: uppercase;
font-weight: none;
letter-spacing: 0px;
background-color: #242424;
color: #D1D1D1;
}
#footer {
padding: 10px 10px 10px 10px;
text-align: center;
font-style: none;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 12px;
text-transform: uppercase;
font-weight: normal;
margin: -15px 0px 0px 0px;
letter-spacing: 0px;
background-color: #242424;
z-index: 100;
clear: both;
width: auto;
}
/* HEADER STUFF - TITLE, SUBTITLE */
div#header a, div#header a:link, div#header a:visited {
font-style: none;
padding: 10px 15px 10px 5px;
margin: 0px;
background-color: #transparent;
color: #5D5D5D;
border-right: 1px solid #303030;
}
div#header a:hover {
font-style: none;
padding: 10px 15px 10px 5px;
margin: 0px;
background-color: #transparent;
color: #ADC2CD;
border-right: 1px solid #303030;
}
div#header li.view {
padding: 10px 15px 10px 5px;
margin-left: 5px;
margin-right: 5px;
background-color: #transparent;
color: #5D5D5D;
border-right: 1px solid #303030;
}
ul.navheader {
padding: 0px;
margin: 0px;
}
ul.navheader li {
display: inline;
padding: 0 3px 0 3px;
}
.title, .subtitle {
display: none;
}
/* FOOTER STUFF */
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
div#footer a, div#footer a:link, div#footer a:visited {
padding: 10px 0px 10px 0px;
margin: 0px;
background-color: #transparent !important;
color: #5D5D5D;
}
div#footer a:hover {
padding: 10px 0px 10px 0px;
margin: 0px;
background-color: #transparent;
color: #ADC2CD;
}
.clearfoot {
display: none;
clear: both;
}
#footer .viewing {
display:none;
}
/* MAINCONTENT STUFF */
.subcontent {
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
font-family: "trebucet ms", sans-serif;
font-size: 10px;
background-color: #FFFFFF;
color: #545454;
margin-left: auto;
text-align: justify;
}
.entry {
margin: 0px 0px 5px 5px;
padding: 20px 10px 20px 10px;
background-color: #FFFFFF;
color: #545454;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 12px;
text-align: justify;
}
.entry ul li {
padding-left: 5px;
margin-left: 16px;
}
.entry ol li {
padding-left: 5px;
margin-left: 16px;
}
.userpic {
font-size: 0px
position: relative;
float: right;
background-color: #FFFFFF;
padding: 10px;
margin: 60px -165px 10px 10px;
z-index: 15;
}
.userpic img, .userpicfriends img {
height: 100px;
width: 100px;
}
.userpicfriends {
font-color: #E24040;
font-size: 9px;
position: relative;
float: right;
padding: 10px;
margin: 60px -165px 10px 10px;
text-align: center;
background-color: #FFFFFF!important;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
z-index: 15;
}
.date {
margin: 0px 5px 0px 5px;
padding: 8px 0px 0px 0px;
text-transform: uppercase;
line-height: 120%;
letter-spacing: 2px;
top: 5px;
color: #DFDFDF;
font-style: none;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 8px;
background-color: #transparent;
}
.subject {
margin: 0px 0px 0px 0px;
padding: 0px;
color: #ADC2CD;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
text-transform: uppercase;
font-style: none;
letter-spacing: 0px;
background-color: #transparent;
font-size: 20px;
}
.subject a, .subject a:link, .subject a:visited {
color: #ADC2CD;
}
.subject a:hover {
color: #545454;
}
.datesubject {
background-color: #FFFFFF;
padding: 5px;
margin: 5px 5px 5px 10px;
border-bottom: 0px #E9E9E9 solid;
text-align: left;
}
.currents {
display: block;
text-align: left;
text-transform: lowercase;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 9px;
border-top: 0px #4F4F4F solid;
border-bottom: 0px #4F4F4F solid;
padding: 10px 0px 10px 0px;
}
.currents strong, .currentmood strong, .currentmusic strong, .ljtags strong {
font-weight: lighter;
text-transform: lowercase;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 9px;
}
.currentmood img {
display: none;
float: right;
margin: -30px 0px 0px 0px;
padding: 5px;
}
.currentlocation{
background: url() no-repeat left center;
padding:0px 0px 0px 0px;
margin: 0;
}
.currentmusic{
background: url() no-repeat left center;
padding:0px 0px 0px 0px;
margin: 0;
}
.currentmood {
background: url() no-repeat left center;
padding:0px 0px 0px 0px;
margin: 0;
}
.comments {
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 0px;
text-align: right;
text-transform: lowercase;
background-color: #EDEDED !important;
padding: 5px 10px 5px 5px;
margin: -10px -10px -20px -15px;
letter-spacing:-2px;
top: 0px;
position: relative;
border-top: 1px solid #E4E4E4;
border-bottom: 1px solid #E4E4E4;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #B4B4B4;
text-decoration: none;
font-weight: none;
font-size: 16px;
}
div.comments a:hover {
color: #E24040;
text-decoration: none;
font-weight: none;
font-size: 16px;
}
/* TAGS, TAGS PAGE */
H2{
color: #ADC2CD;
text-decoration: none;
font-weight: lighter;
background-color: #transparent;
text-align: left;
padding: 10px;
margin: 5px 0px 0px 0px;
text-transform: uppercase;
font-style: none;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 16px;
border-bottom: 1px solid #E4E4E4;
}
.ljtags {
text-align: left;
font-weight: none;
text-transform: lowercase;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 9px;
margin: 10px 0px -43px 0px;
padding: 20px 0px 0px 0px;
background:#transparent;
background: url() no-repeat left center;
}
.ljtags a {
text-align: left;
font-weight: none;
text-transform: lowercase;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 9px;
color: #B4B4B4 !important;
}
ul.ljtaglist{
background-color: #FFFFFF;
list-style: none;
padding: 0px 10px 10px 10px;
width: auto;
text-align: left;
margin-left: auto;
margin-right: auto;
}
/* REPLY, ENTRY STUFF */
.datesubjectcomment {
background-color: #EDEDED;
padding: 5px;
margin: 0px;
color: #FFFFFF;
}
.userpiccomment {
position: relative;
background-color: #FFFFFF;
top: auto;
left: auto;
padding: 10px;
margin: -15px 5px 0px -15px;
z-index: 15;
float: left;
}
.box {
margin: 5px 0px 5px 0px;
background-color: #FFFFFF;
padding: 10px;
clear: right !important;
}
input, textarea {
background-color: #FFFFFF;
color: #545454;
border: 1px #DFDFDF solid;
}
textarea.textbox {
width: 100% !important;
}
.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 12px;
line-height: 125%;
background-color: #FFFFFF;
color: #545454;
}
.replytosubject, .replytoposter {
margin: 0px;
padding: 0px;
text-align: left;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 16px;
}
.commentreply {
padding: 10px;
position: relative;
margin: 5px;
font-size: 12px;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
color: #545454;
}
.commentbox {
border: 1px #E8E8E8 solid !important;
padding: 10px;
margin: 5px 0px 5px 0px;
background-color: #FFFFFF;
background-image: url('');
background-repeat: repeat-y;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #E24040;
}
.datesubjectcomment a:hover {
color: #FFFFFF;
}
.commentboxpartial {
border-color: #E8E8E8 !important;
border-top: 1px;
border-left: 1px;
border-right: 1px;
border-bottom: 1px;
border-style: solid;
padding: 5px;
margin: 5px;
background-color: #FFFFFF;
}
.commentinfo {
background-color: #FFFFFF;
margin-top: 5px;
width: 100%;
}
.skiplinks {
text-align: center;
text-transform: lowercase;
margin: 0px;
}
/* YEAR & ARCHIVE STUFF */
ul.year {
text-align: center;
padding-bottom: 40px;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
background-color: #FFFFFF;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border: 1px #E8E8E8 solid;
}
table.yeartable td.yearday {
background-color: #E9E9E9;
text-align: center;
}
td.yearmonth {
border-style: none;
}
/* MISC STUFF, OUT OF PLACE */
.subject img[src="http://l-stat.livejournal.com/img/icon_protected.gif"]{
width: 0;
height: 0;
padding: 12px 12px 0px 0px !important;
margin: 5px 5px 0 0;
background: url(LINK TO YOUR PICTURE HERE);
}
.subject img[src="http://l-stat.livejournal.com/img/icon_groups.gif"]{
width: 0;
height: 0;
margin: 5px 5px 0 0;
padding: 12px 12px 0px 0px !important;
background: url(LINK TO YOUR PICTURE HERE);
}
.clear {
height: 15px;
background-color: #transparent;
}
.separator{
height: 10px;
background-color: #transparent;
}
Frequently Asked Questions
F.A.Q. OFFICIAL POST
How do I add a header?
Take the following code:
.headerimage {
position: relative;
width: 500px;
height: 220px;
margin-left: auto;
margin-right: auto;
margin-bottom: 0px;
margin-top: 0px;
background-image: url("LINK TO YOUR PICTURE HERE");
background-repeat: no-repeat;
}
Modify the width and height to that of your image. Paste the modified code in the layout css. You'll need to upload your image to the Internet. I recommend using tinypic.com or imageshack.us.
Can I edit the CSS (colors, images, ect)?
Yes, of course. Just make sure you still credit barubaron.
STYLE: S2 Flexible Squares
ACCOUNT TYPES: Paid or Plus
CREDIT barubaron WITH USE
LIVE PREVIEW
Details & Notes:
[All Accounts] The layout is compatible with a navigation bar, but does not come customized. There is no sidebar included in this layout.
[Sponsored Accounts] It is recommended that your ad placement be set for 'between entries'.
I also included the CSS for custom subject icons. Instead of LJ's default 'locked' icon, or the golden friends group icon, you can substitute your own tiny icons. Just remember that the first two paddings -- padding: 16px 16px 0px 0px; -- are the HEIGHT and WIDTH of the icon. Of course, you don't have to use this -- and if you leave it blank LJ's default icons will appear. :)
INSTALLATION INSTRUCTIONS. PLEASE READ THEM.
/* Title: 'Arctic Rash' */
/* Created/Modified: May 2010 */
/* S2 Layout: Flexible Squares */
/* Account Types: Paid or Free */
/* Made by barubaron.livejournal.com */
/* DO NOT CLAIM AS YOUR OWN !! */
/* SPONSORED ACCOUNTS, IT IS RECOMMENDED
TO HAVE YOUR AD PLACEMENT SET FOR BETWEEN ENTRIES. */
/* LAYOUT INCLUDES CUSTOMIZED COMMENTS PAGE. */
/* CONTENT, BACKGROUND STUFF */
body {
background: #DEE7EB url('') repeat;
text-align: justify;
color: #545454;
letter-spacing: 0px;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 12px;
padding: 0px;
margin: 0px 0 0px 0;
line-height: 150%;
}
a, a:link, a:visited {
color: #8CB670;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
text-decoration: none;
}
a:hover {
cursor: help;
color: #E24040;
text-decoration: none;
}
blockquote {
font-size: 12px;
background-color: #FFFFF;
border-top: 3px #ADC2CD dashed;
border-left: 0px #E8E8E8 solid;
border-right: 0px #E8E8E8 solid;
border-bottom: 0px #E8E8E8 solid;
padding: 5px;
}
code, kbd, pre, tt, b, i {
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-color: #FFFFFF;
}
#content {
width: 80%;
margin-left: auto;
margin-right: auto;
margin-top: 40px;
margin-bottom: 20px;
background-color: #ADC2CD;
padding: 0px 0 0px 0;
}
#maincontent {
padding: 0px 0px 0px 0px;
margin: 0px 210px 0px 0px;
border-top: 0px #39A7C7 solid;
background-color: #FFFFFF;
}
#sidebar {
display: none;
}
#header {
padding: 10px 10px 10px 10px;
margin-bottom: -5px;
text-align: left;
font-style: none;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 12px;
text-transform: uppercase;
font-weight: none;
letter-spacing: 0px;
background-color: #242424;
color: #D1D1D1;
}
#footer {
padding: 10px 10px 10px 10px;
text-align: center;
font-style: none;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 12px;
text-transform: uppercase;
font-weight: normal;
margin: -15px 0px 0px 0px;
letter-spacing: 0px;
background-color: #242424;
z-index: 100;
clear: both;
width: auto;
}
/* HEADER STUFF - TITLE, SUBTITLE */
div#header a, div#header a:link, div#header a:visited {
font-style: none;
padding: 10px 15px 10px 5px;
margin: 0px;
background-color: #transparent;
color: #5D5D5D;
border-right: 1px solid #303030;
}
div#header a:hover {
font-style: none;
padding: 10px 15px 10px 5px;
margin: 0px;
background-color: #transparent;
color: #ADC2CD;
border-right: 1px solid #303030;
}
div#header li.view {
padding: 10px 15px 10px 5px;
margin-left: 5px;
margin-right: 5px;
background-color: #transparent;
color: #5D5D5D;
border-right: 1px solid #303030;
}
ul.navheader {
padding: 0px;
margin: 0px;
}
ul.navheader li {
display: inline;
padding: 0 3px 0 3px;
}
.title, .subtitle {
display: none;
}
/* FOOTER STUFF */
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
div#footer a, div#footer a:link, div#footer a:visited {
padding: 10px 0px 10px 0px;
margin: 0px;
background-color: #transparent !important;
color: #5D5D5D;
}
div#footer a:hover {
padding: 10px 0px 10px 0px;
margin: 0px;
background-color: #transparent;
color: #ADC2CD;
}
.clearfoot {
display: none;
clear: both;
}
#footer .viewing {
display:none;
}
/* MAINCONTENT STUFF */
.subcontent {
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
font-family: "trebucet ms", sans-serif;
font-size: 10px;
background-color: #FFFFFF;
color: #545454;
margin-left: auto;
text-align: justify;
}
.entry {
margin: 0px 0px 5px 5px;
padding: 20px 10px 20px 10px;
background-color: #FFFFFF;
color: #545454;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 12px;
text-align: justify;
}
.entry ul li {
padding-left: 5px;
margin-left: 16px;
}
.entry ol li {
padding-left: 5px;
margin-left: 16px;
}
.userpic {
font-size: 0px
position: relative;
float: right;
background-color: #FFFFFF;
padding: 10px;
margin: 60px -165px 10px 10px;
z-index: 15;
}
.userpic img, .userpicfriends img {
height: 100px;
width: 100px;
}
.userpicfriends {
font-color: #E24040;
font-size: 9px;
position: relative;
float: right;
padding: 10px;
margin: 60px -165px 10px 10px;
text-align: center;
background-color: #FFFFFF!important;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
z-index: 15;
}
.date {
margin: 0px 5px 0px 5px;
padding: 8px 0px 0px 0px;
text-transform: uppercase;
line-height: 120%;
letter-spacing: 2px;
top: 5px;
color: #DFDFDF;
font-style: none;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 8px;
background-color: #transparent;
}
.subject {
margin: 0px 0px 0px 0px;
padding: 0px;
color: #ADC2CD;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
text-transform: uppercase;
font-style: none;
letter-spacing: 0px;
background-color: #transparent;
font-size: 20px;
}
.subject a, .subject a:link, .subject a:visited {
color: #ADC2CD;
}
.subject a:hover {
color: #545454;
}
.datesubject {
background-color: #FFFFFF;
padding: 5px;
margin: 5px 5px 5px 10px;
border-bottom: 0px #E9E9E9 solid;
text-align: left;
}
.currents {
display: block;
text-align: left;
text-transform: lowercase;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 9px;
border-top: 0px #4F4F4F solid;
border-bottom: 0px #4F4F4F solid;
padding: 10px 0px 10px 0px;
}
.currents strong, .currentmood strong, .currentmusic strong, .ljtags strong {
font-weight: lighter;
text-transform: lowercase;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 9px;
}
.currentmood img {
display: none;
float: right;
margin: -30px 0px 0px 0px;
padding: 5px;
}
.currentlocation{
background: url() no-repeat left center;
padding:0px 0px 0px 0px;
margin: 0;
}
.currentmusic{
background: url() no-repeat left center;
padding:0px 0px 0px 0px;
margin: 0;
}
.currentmood {
background: url() no-repeat left center;
padding:0px 0px 0px 0px;
margin: 0;
}
.comments {
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 0px;
text-align: right;
text-transform: lowercase;
background-color: #EDEDED !important;
padding: 5px 10px 5px 5px;
margin: -10px -10px -20px -15px;
letter-spacing:-2px;
top: 0px;
position: relative;
border-top: 1px solid #E4E4E4;
border-bottom: 1px solid #E4E4E4;
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #B4B4B4;
text-decoration: none;
font-weight: none;
font-size: 16px;
}
div.comments a:hover {
color: #E24040;
text-decoration: none;
font-weight: none;
font-size: 16px;
}
/* TAGS, TAGS PAGE */
H2{
color: #ADC2CD;
text-decoration: none;
font-weight: lighter;
background-color: #transparent;
text-align: left;
padding: 10px;
margin: 5px 0px 0px 0px;
text-transform: uppercase;
font-style: none;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 16px;
border-bottom: 1px solid #E4E4E4;
}
.ljtags {
text-align: left;
font-weight: none;
text-transform: lowercase;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 9px;
margin: 10px 0px -43px 0px;
padding: 20px 0px 0px 0px;
background:#transparent;
background: url() no-repeat left center;
}
.ljtags a {
text-align: left;
font-weight: none;
text-transform: lowercase;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 9px;
color: #B4B4B4 !important;
}
ul.ljtaglist{
background-color: #FFFFFF;
list-style: none;
padding: 0px 10px 10px 10px;
width: auto;
text-align: left;
margin-left: auto;
margin-right: auto;
}
/* REPLY, ENTRY STUFF */
.datesubjectcomment {
background-color: #EDEDED;
padding: 5px;
margin: 0px;
color: #FFFFFF;
}
.userpiccomment {
position: relative;
background-color: #FFFFFF;
top: auto;
left: auto;
padding: 10px;
margin: -15px 5px 0px -15px;
z-index: 15;
float: left;
}
.box {
margin: 5px 0px 5px 0px;
background-color: #FFFFFF;
padding: 10px;
clear: right !important;
}
input, textarea {
background-color: #FFFFFF;
color: #545454;
border: 1px #DFDFDF solid;
}
textarea.textbox {
width: 100% !important;
}
.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 12px;
line-height: 125%;
background-color: #FFFFFF;
color: #545454;
}
.replytosubject, .replytoposter {
margin: 0px;
padding: 0px;
text-align: left;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
font-size: 16px;
}
.commentreply {
padding: 10px;
position: relative;
margin: 5px;
font-size: 12px;
font-family: Century Gothic, Verdana, Tahoma, Helvetica, sans-serif;
color: #545454;
}
.commentbox {
border: 1px #E8E8E8 solid !important;
padding: 10px;
margin: 5px 0px 5px 0px;
background-color: #FFFFFF;
background-image: url('');
background-repeat: repeat-y;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #E24040;
}
.datesubjectcomment a:hover {
color: #FFFFFF;
}
.commentboxpartial {
border-color: #E8E8E8 !important;
border-top: 1px;
border-left: 1px;
border-right: 1px;
border-bottom: 1px;
border-style: solid;
padding: 5px;
margin: 5px;
background-color: #FFFFFF;
}
.commentinfo {
background-color: #FFFFFF;
margin-top: 5px;
width: 100%;
}
.skiplinks {
text-align: center;
text-transform: lowercase;
margin: 0px;
}
/* YEAR & ARCHIVE STUFF */
ul.year {
text-align: center;
padding-bottom: 40px;
}
ul.year li {
display: inline;
}
table.yeartable {
margin-left: auto;
margin-right: auto;
background-color: #FFFFFF;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border: 1px #E8E8E8 solid;
}
table.yeartable td.yearday {
background-color: #E9E9E9;
text-align: center;
}
td.yearmonth {
border-style: none;
}
/* MISC STUFF, OUT OF PLACE */
.subject img[src="http://l-stat.livejournal.com/img/icon_protected.gif"]{
width: 0;
height: 0;
padding: 12px 12px 0px 0px !important;
margin: 5px 5px 0 0;
background: url(LINK TO YOUR PICTURE HERE);
}
.subject img[src="http://l-stat.livejournal.com/img/icon_groups.gif"]{
width: 0;
height: 0;
margin: 5px 5px 0 0;
padding: 12px 12px 0px 0px !important;
background: url(LINK TO YOUR PICTURE HERE);
}
.clear {
height: 15px;
background-color: #transparent;
}
.separator{
height: 10px;
background-color: #transparent;
}
Frequently Asked Questions
F.A.Q. OFFICIAL POST
How do I add a header?
Take the following code:
.headerimage {
position: relative;
width: 500px;
height: 220px;
margin-left: auto;
margin-right: auto;
margin-bottom: 0px;
margin-top: 0px;
background-image: url("LINK TO YOUR PICTURE HERE");
background-repeat: no-repeat;
}
Modify the width and height to that of your image. Paste the modified code in the layout css. You'll need to upload your image to the Internet. I recommend using tinypic.com or imageshack.us.
Can I edit the CSS (colors, images, ect)?
Yes, of course. Just make sure you still credit barubaron.