S2 Smooth Sailing // Cuatro Estaciones
After working hard for a week and thanks to this helpful CSS guide written by carriep63 for Smooth Sailing, I've finished my first Smooth sailing Stylesheet. Woohoo!!
And to spice things up a little bit, I've decided to make this layout available in 4 different colors, how cool is that huh? I just needed something to do on my week off for easter holidays and I think I've spent this time doing something very productive. Now, onto the layouts.
Style: S2 Smooth Sailing
Website: Not required but it looks better if you define one.
Default Icon: Optional
Best view: 1024x768 and up
Browser(s) Compatible: IE // I didn't test it on Firefox, so let me know if it works ;)
Nav Bar?: Yes
Custom Comment Page?: Yes
Work best with: Free & Paid account
Works okay in: Plus account, but it's always the user's choice.
Click on the image for Full-Size Preview
Grey Layout Overrides
/*---------------------------------------------------
Stylesheet By: Resplandor@livejournal.com
Style: S2 Smooth Sailing
Works best with: Free & Paid accounts
Browser: Firefox and IE
-----------------------------------------------------*/
/* PAGE BODY */
body {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin-bottom: 10px!important;
background-color: #dddddd;
color: #333333;
background-image: url('');
margin-top: 10px;
}
/*HIDES PROTECTED ICON & REPLACES LJ USER ICON*/
.entryHeaderSubject img {
display: none;
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
/* so that IE users will still see an image */
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding:8px 7px 0 2px;
}
.ljuser img[src="http://stat.livejournal.com/img/userinfo.gif"] {
background-color:transparent;
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding: 8px 7px 0 2px;
}
/* QUOTATION */
blockquote {
margin-left: 15px 15px;
padding: 5px;
border-left: 1px solid #dddddd;
border-right: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
border-top: 1px solid #dddddd;
background-image: url();
background-repeat: repeat;
background-position: top left;
}
/* MAIN LINKS */
a {
color: #000000;
}
a:visited {
color: #000000;
}
a:hover{
color: #999999;
border-bottom: 1px dashed #000000;
}
/*PAGE FOOTER*/
.pagefooterblock {
border: 1px solid #000000;
background-color: #404040;
color: #ffffff;
padding: 4px 4px 4px 24px;
margin-top: 0px;
}
.pagefooterblock a, .pagefooterblock a:visited {
color: #ffffff;
}
/*PAGE HEADER */
.pageblock{
background-image: url('HEADERURLHERE');
background-position: top center;
background-repeat: no-repeat;
padding-top: 25px;
width:750px;
margin: 0 auto;
}
.pageheaderblock {
text-align: center;
}
.header-title {
display: none;
padding: 0px 0px 0px 0px;
}
.header-subtitle {
display:none;
padding: 0px 0px 0px 0px;
}
.header-icon {
top: 0px;
right: 0px;
position: absolute;
z-index: 1;
border-left: 2px solid #ffffff;
border-bottom: 2px solid #ffffff;
}
/*NAVIGATION LINKS*/
.header-menu {
margin-top: 0px;
padding: 8px;
background-color: #404040;
border: 1px solid #000000;
padding-left: auto;
font-family:"tahoma";
font-size: 12px;
text-transform: uppercase;
line-height: 20px;
}
.header-menu a, .header-menu a:visited {
white-space: nowrap;
text-align: center;
padding: 2px 6px 2px 6px;
color: #ffffff;
text-decoration: none;
}
.header-menu a:hover {
background-color: #efefef;
color: #000000;
}
.header-menu ul, #footer-menu ul {
margin: 0px;
padding: 0px;
}
.header-menu li, #footer-menu li {
margin-left: 5px;
margin-right: 5px;
display: inline;
}
/*PREVIOUS/NEXT, BACK TO TOP LINKS*/
.bodyblock {
background-color: #ffffff!important;
padding: 0px 0px 0px 0px;
}
.bodyheaderblock {
border-top: 0px solid #ffffff;
background-color: #efefef;
padding: 0px 0px 0px 0px;
}
.bodynavblock {
font-family: "tahoma", "verdana", sans-serif;
font-size: 12px;
text-align: right;
background-color: #ffffff;
margin: 10px 0px 4px 0px;
padding:15px;
}
.bodynavblock a, .bodynavblock a:visited {
color: #000000!important;
}
.bodynavblock a:hover{
color: #999999!important;
bottom-border: 1px dashed #000000;
}
.body-title {
display: none;
}
.body-midtitle {
display: none;
}
/*ENTRIES*/
.entryHolder {
color: #333333;
background-color: #ffffff;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin: 4px 4px 4px 0px;
}
.entryText {
text-align: justify;
padding: 11px;
}
/*ICON IN ENTRIES*/
.entryUserinfo {
border: 1px solid #efefef;
text-align: center;
padding: 5px 5px 5px 5px;
margin: 5px 5px 5px 5px;
background-color: transparent;
}
.entryUserinfo-usericon img {
border: 0;
}
/*SUBJECT AND DATE IN ENTRIES*/
.entryHeader {
border-bottom:1px solid #efefef;
text-align: right;
background-color: #ffffff;
color: #999999;
font-family:"Tahoma", "verdana", sans-serif;
font-size: 7.5pt;
padding: 5px 7px 5px 7px;
}
.entryHeader a, .entryHeader a:visited {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeader a:hover {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: dolid;
border-color: #efefef;
}
.entryHeaderSubject {
margin-right: 10px;
font-family: "tahoma", "verdana", sans-serif;
font-size: 8pt;
letter-spacing: 2pt;
font-weight: normal;
text-transform: uppercase;
text-decoration: none;
}
.entryHeaderDate a {
color: #cccccc;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeaderDate a:hover {
color : #c9c9c9;
text-decoration : underline;
}
/*CURRENT MUSIC,MOOD, TAGS & LOCATION IN ENTRIES*/
.entryMetadata {
padding-left: 10px;
display: block;
}
.entryMetadata ul {
margin: 2px;
padding: 0px;
}
.entryMetadata li {
list-style: none;
display: block;
padding-right: 10px;
}
.entryMetadata-label {
font-weight: bold;
padding-right: 4px;
}
/*COMMENT LINKS IN ENTRIES*/
.entryLinkbar {
font-family:"tahoma", "verdana", sans-serif;
font-size: 7pt;
color: #000000;
text-align: right;
padding: 6px 0px 6px 0px;
}
.entryLinkbar ul {
margin: 0px;
padding: 0px;
}
.entryLinkbar li {
padding: 0px 5px 0px 5px;
margin: 5px;
display: inline;
}
/*FOOTER*/
#footer-menu {
font-size: 11px;
}
#footer-menu a, .footer-menu a:visited {
color: #000000;
white-space: nowrap;
padding: 6px;
text-align: left;
}
/*SIDEBAR*/
.sidebar {
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7pt;
margin: 15px 15px 0 15px;
width: 150px;
}
.sidebox {
color: #333333;
background-color: #ffffff;
margin: 4px 0px 4px 0px;
}
.sideboxTitle {
background-color: #ffffff;
border: 1px solid #efefef;
color: #333333;
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
}
.sideboxContent {
text-align: justify;
padding: 2px 4px 2px 4px;
}
.sidebox #profile {
padding: 2px 0px 2px 0px;
text-align: center;
display: yes;
}
.sidebox #search{
margin: 10px 0px 10px 0px;
}
.sidebox #tags_sidebox, .sidebox #tags_sidebox ul, .sidebox #tags_sidebox li {
text-align: center;
margin: 2px;
margin-bottom: 10px;
}
.sidebox #systemlinks {
padding: 5px 5px 5px 5px;
text-align: center;
margin: 2px;
}
.sidebox #latestmonth table{
font-family: "tahoma";
font-size: 7pt!important;
font-color: #999999;
width: 70%;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
padding: 3px;
}
.listtitle {
background-color: #ffffff;
border: 1px solid #efefef;
color: #333333;
font-family: verdana, tahoma, arial, sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
margin-top: 5px;
margin-bottom: 5px;
}
.profile-label {
font-size: 6px
font-weight: bold;
display: none;
}
.profile-content {
font-size: 6px
font-weight: normal;
display: none;
}
/*OTHER PAGES*/
input, textarea, option, select {
background-color: #ffffff;
font: 7pt tahoma,verdana,sans-serif;
color: #999999!important;
border: 1px solid #efefef;
padding: 0px;
margin-top: 1px;
}
/* COMMENT PAGE */
.commentHolder {
border-top: 2px solid #ffffff;
background-color: #ffffff;
border-left: 1px solid #efefef;
border-right: 1px solid #efefef;
margin: 6px 12px 4px 16px;
}
.commentUserinfo {
text-align: center;
margin: 5px 5px 5px 5px;
background-color: #ffffff;
}
.commentUserinfo-usericon img {
border: 0px;
}
.commentText {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7,5pt;
font-color: 333333!important;
text-align: justify;
padding: 12px;
}
.commentHeader {
background-color: #ffffff;
border-width: 1px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
color: #333333;
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
padding: 4px 0px 4px 8px;
}
.commentHeader a{
color: #000000;
}
.commentHeaderScreened {
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
background-color: #ffffff;
border-width: 1px 1px 1px 1px;
border-style: solid;
border-color: #666666;
padding: 4px 0px 4px 8px;
}
.commentHeaderSubject {
font-weight: normal;
}
.commentLinkbar {
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
color: #000000;
text-align: right;
padding-top: 4px;
padding-bottom: 4px;
}
.commentLinkbar ul {
margin: 0px;
padding: 0px;
}
.commentLinkbar li {
padding: 0px 5px 0px 5px;
margin: 0px;
display: inline;
}
.replyform {
background-color: #ffffff;
color: #333333;
padding-left: 10px;
}
#commenttext{
width:100%;
}
/*CALENDAR PAGE*/
.yearlinks{
text-align: right;
}
.yearlink{
padding-left:4px;
padding-right: 4px;
}
.month {
width: 500px;
border: 1px solid #efefef;
margin: 8px 8px 8px 40px;
}
.daysubjects {
color: #333333;
padding: 8px 8px 8px 40px;
}
.daytitles {
text-align: center;
border: 1px solid #efefef;
background: #ffffff;
color: #333333;
}
.day-blank {
border: 1px solid #efefef;
}
.day {
border: 1px solid #efefef;
}
.day-date {
border-right: 1px solid #efefef;
border-bottom: 1px solid #efefef;
color: #333333;
width: 50%;
text-align: center;
}
.day-count {
width: 50%;
text-align: center;
float: right;
font-size: 8pt;
}
.day-count a {
text-decoration: none;
color: #000000;
}
.day-count a:hover{
color: #999999;
}
/*TAGS PAGE*/
.tagstable, .tagstable td {
border: 1px solid #efefef;
}
.tagstable {
width: 90%;
}
Click on the image for Full-Size Preview
Pink Layout Overrides
/*---------------------------------------------------
Stylesheet By: Resplandor@livejournal.com
Style: S2 Smooth Sailing
Works best with: Free & Paid accounts
Browser: Firefox and IE
-----------------------------------------------------*/
/* PAGE BODY */
body {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin-bottom: 10px!important;
background-color: #efefef;
color: #999999;
background-image: url('');
margin-top: 10px;
}
/*HIDES PROTECTED ICON & REPLACES LJ USER ICON*/
.entryHeaderSubject img {
display: none;
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
/* so that IE users will still see an image */
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding:8px 7px 0 2px;
}
.ljuser img[src="http://stat.livejournal.com/img/userinfo.gif"] {
background-color:transparent;
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding: 8px 7px 0 2px;
}
/* QUOTATION */
blockquote {
margin-left: 15px 15px;
padding: 5px;
border-left:1px solid #dddddd;
border-right: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
border-top: 1px solid #dddddd;
background-image: url();
background-repeat: repeat;
background-position: top left;
}
/* MAIN LINKS */
a {
color: #000000;
}
a:visited {
color: #000000;
}
a:hover{
color: #ff1493;
border-bottom: 1px dashed #000000;
}
/*PAGE FOOTER*/
.pagefooterblock {
border: 1px solid #ff1493;
background-color: #ff69b4;
color: #ffffff;
padding: 4px 4px 4px 24px;
margin-top: 0px;
}
.pagefooterblock a, .pagefooterblock a:visited {
color: #ffffff;
}
/*PAGE HEADER */
.pageblock{
background-image: url('HEADERURLHERE');
background-position: top center;
background-repeat: no-repeat;
padding-top: 25px;
width:750px;
margin: 0 auto;
}
.pageheaderblock {
text-align:center;
}
.header-title {
display: none;
padding: 0px 0px 0px 0px;
}
.header-subtitle {
display:none;
padding: 0px 0px 0px 0px;
}
.header-icon {
top: 0px;
right: 0px;
position: absolute;
z-index: 1;
border-left: 2px solid #ffffff;
border-bottom: 2px solid #ffffff;
}
/*NAVIGATION LINKS*/
.header-menu {
margin-top: 0px;
padding: 8px;
background-color: #ff69b4;
border: 1px solid #ff1493;
padding-left: auto;
font-family:"tahoma";
font-size: 12px;
text-transform: uppercase;
line-height: 20px;
}
.header-menu a, .header-menu a:visited {
white-space: nowrap;
text-align: center;
padding: 2px 6px 2px 6px;
color: #ffffff;
text-decoration: none;
}
.header-menu a:hover {
background-color: #ffffff;
color: #ff1493;
}
.header-menu ul, #footer-menu ul {
margin: 0px;
padding: 0px;
}
.header-menu li, #footer-menu li {
margin-left: 5px;
margin-right: 5px;
display: inline;
}
/*PREVIOUS/NEXT, BACK TO TOP LINKS*/
.bodyblock {
background-color: #ffffff!important;
padding: 0px 0px 0px 0px;
}
.bodyheaderblock {
border-top: 0px solid #ffffff;
background-color: #efefef;
padding: 0px 0px 0px 0px;
}
.bodynavblock {
font-family: "tahoma", "verdana", sans-serif;
font-size: 12px;
text-align: right;
background-color: #ffffff;
margin: 10px 0px 4px 0px;
padding:15px;
}
.bodynavblock a, .bodynavblock a:visited {
color: #000000!important;
bottom-border: 1px dashed #ff1493;
}
.bodynavblock a:hover{
color: #ff1493!important;
}
.body-title {
display: none;
}
.body-midtitle {
display: none;
}
/*ENTRIES*/
.entryHolder {
color: #999999;
background-color: #ffffff;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin: 4px 4px 4px 0px;
}
.entryText {
text-align: justify;
padding: 6px;
}
/*ICON IN ENTRIES*/
.entryUserinfo {
border: 1px solid #efefef;
text-align: center;
padding: 5px 5px 5px 5px;
margin: 5px 5px 5px 5px;
background-color: transparent;
}
.entryUserinfo-usericon img {
border: 0;
}
/*SUBJECT AND DATE IN ENTRIES*/
.entryHeader {
border-bottom:1px solid #efefef;
text-align: right;
background-color: #ffffff;
color: #999999;
font-family:"Tahoma", "verdana", sans-serif;
font-size: 7.5pt;
padding: 5px 7px 5px 7px;
}
.entryHeader a, .entryHeader a:visited {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeader a:hover {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: dolid;
border-color: #efefef;
}
.entryHeaderSubject {
margin-right: 10px;
font-family: "tahoma", "verdana", sans-serif;
font-size: 8pt;
letter-spacing: 2pt;
font-weight: normal;
text-transform: uppercase;
text-decoration: none;
}
.entryHeaderDate a {
color: #cccccc;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeaderDate a:hover {
color : #c9c9c9;
text-decoration : underline;
}
/*CURRENT MUSIC,MOOD, TAGS & LOCATION IN ENTRIES*/
.entryMetadata {
padding-left: 10px;
display: block;
}
.entryMetadata ul {
margin: 2px;
padding: 0px;
}
.entryMetadata li {
list-style: none;
display: block;
padding-right: 10px;
}
.entryMetadata-label {
font-weight: bold;
padding-right: 4px;
}
/*COMMENT LINKS IN ENTRIES*/
.entryLinkbar {
font-family:"tahoma", "verdana", sans-serif;
font-size: 7pt;
color: #000000;
text-align: right;
padding: 6px 0px 6px 0px;
}
.entryLinkbar ul {
margin: 0px;
padding: 0px;
}
.entryLinkbar li {
padding: 0px 5px 0px 5px;
margin: 5px;
display: inline;
}
/*FOOTER*/
#footer-menu {
font-size: 11px;
}
#footer-menu a, .footer-menu a:visited {
color: #000000;
white-space: nowrap;
padding: 6px;
text-align: left;
}
/*SIDEBAR*/
.sidebar {
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7pt;
margin: 15px 15px 0 15px;
width: 150px;
}
.sidebox {
color: #999999;
background-color: #ffffff;
margin: 4px 0px 4px 0px;
}
.sideboxTitle {
background-color: #ffffff;
border: 1px solid #efefef;
color: #999999;
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
}
.sideboxContent {
text-align: justify;
padding: 2px 4px 2px 4px;
}
.sidebox #profile {
padding: 2px 0px 2px 0px;
text-align: center;
display: yes;
}
.sidebox #search{
margin: 10px 0px 10px 0px;
}
.sidebox #tags_sidebox, .sidebox #tags_sidebox ul, .sidebox #tags_sidebox li {
text-align: center;
margin: 2px;
}
.sidebox #systemlinks {
padding: 5px 5px 5px 5px;
text-align: center;
margin: 2px;
}
.sidebox #latestmonth table{
font-family: "tahoma";
font-size: 7pt!important;
font-color: #999999;
width: 70%;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
padding: 3px;
}
.listtitle {
background-color: #FFFFFF;
border: 1px solid #efefef;
color: #999999;
font-family: verdana, tahoma, arial, sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
margin-top: 5px;
margin-bottom: 5px;
}
.profile-label {
font-size: 6px
font-weight: bold;
display: none;
}
.profile-content {
font-size: 6px
font-weight: normal;
display: none;
}
/*OTHER PAGES*/
input, textarea, option, select {
background-color: #FFFFFF;
font: 7pt tahoma,verdana,sans-serif;
color: #999999!important;
border: 1px solid #efefef;
padding: 0px;
margin-top: 1px;
}
/* COMMENT PAGE */
.commentHolder {
border-top: 2px solid #ffffff;
background-color: #ffffff;
border-left: 1px solid #efefef;
border-right: 1px solid #efefef;
margin: 6px 12px 4px 16px;
}
.commentUserinfo {
text-align: center;
margin: 5px 5px 5px 5px;
background-color: #ffffff;
}
.commentUserinfo-usericon img {
border: 0px;
}
.commentText {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7,5pt;
font-color: 999999!important;
text-align: justify;
padding: 6px;
}
.commentHeader {
background-color: #ffffff;
border-width: 1px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
color: #999999;
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
padding: 4px 0px 4px 8px;
}
.commentHeader a{
color: #000000;
}
.commentHeaderScreened {
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
background-color: #ffffff;
border-width: 1px 1px 1px 1px;
border-style: solid;
border-color: #666666;
padding: 4px 0px 4px 8px;
}
.commentHeaderSubject {
font-weight: normal;
}
.commentLinkbar {
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
color: #000000;
text-align: right;
padding-top: 4px;
padding-bottom: 4px;
}
.commentLinkbar ul {
margin: 0px;
padding: 0px;
}
.commentLinkbar li {
padding: 0px 5px 0px 5px;
margin: 0px;
display: inline;
}
.replyform {
background-color: #ffffff;
color: #999999;
padding-left: 10px;
}
#commenttext{
width:100%;
}
/*CALENDAR PAGE*/
.yearlinks{
text-align: right;
}
.yearlink{
padding-left:4px;
padding-right: 4px;
}
.month {
width: 500px;
border: 1px solid #efefef;
margin: 8px 8px 8px 40px;
}
.daysubjects {
color: #999999;
padding: 8px 8px 8px 40px;
}
.daytitles {
text-align: center;
border: 1px solid #efefef;
background: #ffffff;
color: #999999;
}
.day-blank {
border: 1px solid #efefef;
}
.day {
border: 1px solid #efefef;
}
.day-date {
border-right: 1px solid #efefef;
border-bottom: 1px solid #efefef;
color: #999999;
width: 50%;
text-align: center;
}
.day-count {
width: 50%;
text-align: center;
float: right;
font-size: 8pt;
}
.day-count a {
text-decoration: none;
color: #000000;
}
.day-count a:hover{
color: #ff1493;
}
/*TAGS PAGE*/
.tagstable, .tagstable td {
border: 1px solid #efefef;
}
.tagstable {
width: 90%;
}
Click on the image for Full-Size Preview
Purple Layout Overrides
/*---------------------------------------------------
Stylesheet By: Resplandor@livejournal.com
Style: S2 Smooth Sailing
Works best with: Free & Paid accounts
Browser: Firefox and IE
-----------------------------------------------------*/
/* PAGE BODY */
body {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin-bottom: 10px!important;
background-color: #efefef;
color: #333333;
background-image: url('');
margin-top: 10px;
}
/*HIDES PROTECTED ICON & REPLACES LJ USER ICON*/
.entryHeaderSubject img {
display: none;
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
/* so that IE users will still see an image */
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding:8px 7px 0 2px;
}
.ljuser img[src="http://stat.livejournal.com/img/userinfo.gif"] {
background-color:transparent;
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding: 8px 7px 0 2px;
}
/* QUOTATION */
blockquote {
margin-left: 15px 15px;
padding: 5px;
border-left: 1px solid #efefef;
border-right: 1px solid #efefef;
border-bottom: 1px solid #efefef;
border-top: 1px solid #efefef;
background-image: url();
background-repeat: repeat;
background-position: top left;
}
/* MAIN LINKS */
a {
color: #000000;
}
a:visited {
color: #000000;
}
a:hover{
color: #8A5AEB;
border-bottom: 1px dashed #9400d3;
}
/*PAGE FOOTER*/
.pagefooterblock {
background-color: #9E81D9;
border: 1px solid #9932cc;
color: #ffffff;
padding: 4px 4px 4px 24px;
margin-top: 0px;
}
.pagefooterblock a, .pagefooterblock a:visited {
color: #ffffff;
}
/*PAGE HEADER */
.pageblock{
background-image: url('HEADERURLHERE');
background-position: top center;
background-repeat: no-repeat;
padding-top: 25px;
width:750px;
margin: 0 auto;
}
.pageheaderblock {
text-align: center;
}
.header-title {
display: none;
padding: 0px 0px 0px 0px;
}
.header-subtitle {
display:none;
padding: 0px 0px 0px 0px;
}
.header-icon {
top: 0px;
right: 0px;
position: absolute;
z-index: 1;
border-left: 2px solid #ffffff;
border-bottom: 2px solid #ffffff;
}
/*NAVIGATION LINKS*/
.header-menu {
margin-top: 0px;
padding: 8px;
background-color: #9E81D9;
border: 1px solid #9932cc;
padding-left: auto;
font-family:"tahoma";
font-size: 12px;
text-transform: uppercase;
line-height: 20px;
}
.header-menu a, .header-menu a:visited {
white-space: nowrap;
text-align: center;
padding: 2px 6px 2px 6px;
color: #ffffff;
text-decoration: none;
}
.header-menu a:hover {
background-color: #ffffff;
color: #9932cc;
}
.header-menu ul, #footer-menu ul {
margin: 0px;
padding: 0px;
}
.header-menu li, #footer-menu li {
margin-left: 5px;
margin-right: 5px;
display: inline;
}
/*PREVIOUS/NEXT, BACK TO TOP LINKS*/
.bodyblock {
background-color: #ffffff!important;
padding: 0px 0px 0px 0px;
}
.bodyheaderblock {
border-top: 0px solid #ffffff;
background-color: #efefef;
padding: 0px 0px 0px 0px;
}
.bodynavblock {
font-family: "tahoma", "verdana", sans-serif;
font-size: 12px;
text-align: right;
background-color: #ffffff;
margin: 10px 0px 4px 0px;
padding:15px;
}
.bodynavblock a, .bodynavblock a:visited {
color: #000000!important;
}
.bodynavblock a:hover{
color: #8A5AEB!important;
}
.body-title {
display: none;
}
.body-midtitle {
display: none;
}
/*ENTRIES*/
.entryHolder {
color: #333333;
background-color: #ffffff;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin: 4px 4px 4px 0px;
}
.entryText {
text-align: justify;
padding: 6px;
}
/*ICON IN ENTRIES*/
.entryUserinfo {
border: 1px solid #efefef;
text-align: center;
padding: 5px 5px 5px 5px;
margin: 5px 5px 5px 5px;
background-color: transparent;
}
.entryUserinfo-usericon img {
border: 0;
}
/*SUBJECT AND DATE IN ENTRIES*/
.entryHeader {
border-bottom:1px solid #efefef;
text-align: right;
background-color: #ffffff;
color: #333333;
font-family:"Tahoma", "verdana", sans-serif;
font-size: 7.5pt;
padding: 5px 7px 5px 7px;
}
.entryHeader a, .entryHeader a:visited {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeader a:hover {
color: #000000;
border-width: 0px 0px 1px 0px;
border-style: dolid;
border-color: #efefef;
}
.entryHeaderSubject {
margin-right: 10px;
font-family: "tahoma", "verdana", sans-serif;
font-size: 8pt;
letter-spacing: 2pt;
font-weight: normal;
text-transform: uppercase;
text-decoration: none;
}
.entryHeaderDate a {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeaderDate a:hover {
color : #000000;
text-decoration : underline;
}
/*CURRENT MUSIC,MOOD, TAGS & LOCATION IN ENTRIES*/
.entryMetadata {
padding-left: 10px;
display: block;
}
.entryMetadata ul {
margin: 2px;
padding: 0px;
}
.entryMetadata li {
list-style: none;
display: block;
padding-right: 10px;
}
.entryMetadata-label {
font-weight: bold;
padding-right: 4px;
}
/*COMMENT LINKS IN ENTRIES*/
.entryLinkbar {
font-family:"tahoma", "verdana", sans-serif;
font-size: 7pt;
color: #000000;
text-align: right;
padding: 6px 0px 6px 0px;
}
.entryLinkbar ul {
margin: 0px;
padding: 0px;
}
.entryLinkbar li {
padding: 0px 5px 0px 5px;
margin: 5px;
display: inline;
}
/*FOOTER*/
#footer-menu {
font-size: 11px;
}
#footer-menu a, .footer-menu a:visited {
color: #000000;
white-space: nowrap;
padding: 6px;
text-align: left;
}
/*SIDEBAR*/
.sidebar {
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7pt;
margin: 15px 15px 0 15px;
width: 150px;
}
.sidebox {
color: #333333;
background-color: #ffffff;
margin: 4px 0px 4px 0px;
}
.sideboxTitle {
background-color: #ffffff;
border: 1px solid #efefef;
color: #333333;
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
}
.sideboxContent {
text-align: justify;
padding: 2px 4px 2px 4px;
}
.sidebox #profile {
padding: 2px 0px 2px 0px;
text-align: center;
display: yes;
}
.sidebox #search{
margin: 10px 0px 10px 0px;
}
.sidebox #tags_sidebox, .sidebox #tags_sidebox ul, .sidebox #tags_sidebox li {
text-align: center;
margin: 2px;
}
.sidebox #systemlinks {
padding: 5px 5px 5px 5px;
text-align: center;
margin: 2px;
}
.sidebox #latestmonth table{
font-family: "tahoma";
font-size: 7pt!important;
color: #939393!important;
width: 70%;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
padding: 3px;
}
.listtitle {
background-color: #ffffff;
border: 1px solid #efefef;
color: #333333;
font-family: verdana, tahoma, arial, sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
margin-top: 5px;
margin-bottom: 5px;
}
.profile-label {
font-size: 6px
font-weight: bold;
display: none;
}
.profile-content {
font-size: 6px
font-weight: normal;
display: none;
}
/*OTHER PAGES*/
input, textarea, option, select {
background-color: #ffffff;
font: 7pt tahoma,verdana,sans-serif;
color: #999999!important;
border: 1px solid #efefef;
padding: 0px;
margin-top: 1px;
}
/* COMMENT PAGE */
.commentHolder {
border-top: 2px solid #ffffff;
background-color: #ffffff;
border-left: 1px solid #efefef;
border-right: 1px solid #efefef;
margin: 6px 12px 4px 16px;
}
.commentUserinfo {
text-align: center;
margin: 5px 5px 5px 5px;
background-color: #ffffff;
}
.commentUserinfo-usericon img {
border: 0px;
}
.commentText {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7,5pt;
font-color: 999999!important;
text-align: justify;
padding: 6px;
}
.commentHeader {
background-color: #ffffff;
border-width: 1px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
color: #999999;
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
padding: 4px 0px 4px 8px;
}
.commentHeader a{
color: #000000;
}
.commentHeaderScreened {
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
background-color: #ffffff;
border-width: 1px 1px 1px 1px;
border-style: solid;
border-color: #666666;
padding: 4px 0px 4px 8px;
}
.commentHeaderSubject {
font-weight: normal;
}
.commentLinkbar {
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
color: #000000;
text-align: right;
padding-top: 4px;
padding-bottom: 4px;
}
.commentLinkbar ul {
margin: 0px;
padding: 0px;
}
.commentLinkbar li {
padding: 0px 5px 0px 5px;
margin: 0px;
display: inline;
}
.replyform {
background-color: #ffffff;
color: #999999;
padding-left: 10px;
}
#commenttext{
width:100%;
}
/*CALENDAR PAGE*/
.yearlinks{
text-align: right;
}
.yearlink{
padding-left:4px;
padding-right: 4px;
}
.month {
width: 500px;
border: 1px solid #efefef;
margin: 8px 8px 8px 40px;
}
.daysubjects {
color: #999999;
padding: 8px 8px 8px 40px;
}
.daytitles {
text-align: center;
border: 1px solid #efefef;
background: #ffffff;
color: #999999;
}
.day-blank {
border: 1px solid #efefef;
}
.day {
border: 1px solid #efefef;
}
.day-date {
border-right: 1px solid #efefef;
border-bottom: 1px solid #efefef;
color: #999999;
width: 50%;
text-align: center;
}
.day-count {
width: 50%;
text-align: center;
float: right;
font-size: 8pt;
}
.day-count a {
text-decoration: none;
color: #000000;
}
.day-count a:hover{
color: #8A5AEB;
}
/*TAGS PAGE*/
.tagstable, .tagstable td {
border: 1px solid #efefef;
}
.tagstable {
width: 90%;
}
Click on the image for Full-Size Preview
Blue Layout Overrides
/*---------------------------------------------------
Stylesheet By: Resplandor@livejournal.com
Style: S2 Smooth Sailing
Works best with: Free & Paid accounts
Browser: Firefox and IE
-----------------------------------------------------*/
/* PAGE BODY */
body {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin-bottom: 10px!important;
background-color: #efefef;
color: #999999;
background-image: url('');
margin-top: 10px;
}
/*HIDES PROTECTED ICON & REPLACES LJ USER ICON*/
.entryHeaderSubject img {
display: none;
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
/* so that IE users will still see an image */
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding:8px 7px 0 2px;
}
.ljuser img[src="http://stat.livejournal.com/img/userinfo.gif"] {
background-color:transparent;
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding: 8px 7px 0 2px;
}
/* QUOTATION */
blockquote {
margin-left: 20px 20px;
padding: 5px;
border-left: 1px solid #dddddd;
border-right: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
border-top: 1px solid #dddddd;
background-image: url();
background-repeat: repeat;
background-position: top left;
}
/* MAIN LINKS */
a {
color: #404040;
}
a:visited {
color: #404040;
}
a:hover{
color: #87cefa;
border-bottom: 1px dashed #000000;
}
/*PAGE FOOTER*/
.pagefooterblock {
border: 1px solid #00bfff;
background-color: #87cefa;
color: #ffffff;
padding: 4px 4px 4px 24px;
margin-top: 0px;
}
.pagefooterblock a, .pagefooterblock a:visited {
color: #ffffff;
}
/*PAGE HEADER */
.pageblock{
background-image: url('HEADERURLHERE');
background-position: top center;
background-repeat: no-repeat;
padding-top: 25px;
width:750px;
margin: 0 auto;
}
.pageheaderblock {
text-align: center;
}
.header-title {
display: none;
padding: 0px 0px 0px 0px;
}
.header-subtitle {
display:none;
padding: 0px 0px 0px 0px;
}
.header-icon {
top: 0px;
right: 0px;
position: absolute;
z-index: 1;
border-left: 2px solid #ffffff;
border-bottom: 2px solid #ffffff;
}
/*NAVIGATION LINKS*/
.header-menu {
margin-top: 0px;
padding: 8px;
background-color: #87cefa;
border: 1px solid #00bfff;
padding-left: auto;
font-family:"tahoma";
font-size: 12px;
text-transform: uppercase;
line-height: 20px;
}
.header-menu a, .header-menu a:visited {
white-space: nowrap;
text-align: center;
padding: 2px 6px 2px 6px;
color: #ffffff;
text-decoration: none;
}
.header-menu a:hover {
background-color: #ffffff;
color: #1e90ff;
}
.header-menu ul, #footer-menu ul {
margin: 0px;
padding: 0px;
}
.header-menu li, #footer-menu li {
margin-left: 5px;
margin-right: 5px;
display: inline;
}
/*PREVIOUS/NEXT, BACK TO TOP LINKS*/
.bodyblock {
background-color: #ffffff!important;
padding: 0px 0px 0px 0px;
}
.bodyheaderblock {
border-top: 0px solid #ffffff;
background-color: #efefef;
padding: 0px 0px 0px 0px;
}
.bodynavblock {
font-family: "tahoma", "verdana", sans-serif;
font-size: 12px;
text-align: right;
background-color: #ffffff;
margin: 10px 0px 4px 0px;
padding:15px;
}
.bodynavblock a, .bodynavblock a:visited {
color: #000000!important;
}
.bodynavblock a:hover{
color: #1e90ff!important;
}
.body-title {
display: none;
}
.body-midtitle {
display: none;
}
/*ENTRIES*/
.entryHolder {
color: #999999;
background-color: #ffffff;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin: 4px 4px 4px 0px;
}
.entryText {
text-align: justify;
padding: 6px;
}
/*ICON IN ENTRIES*/
.entryUserinfo {
border: 1px solid #efefef;
text-align: center;
padding: 5px 5px 5px 5px;
margin: 5px 5px 5px 5px;
background-color: transparent;
}
.entryUserinfo-usericon img {
border: 0;
}
/*SUBJECT AND DATE IN ENTRIES*/
.entryHeader {
border-bottom:1px solid #efefef;
text-align: right;
background-color: #ffffff;
color: #999999;
font-family:"Tahoma", "verdana", sans-serif;
font-size: 7.5pt;
padding: 5px 7px 5px 7px;
}
.entryHeader a, .entryHeader a:visited {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeader a:hover {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: dolid;
border-color: #efefef;
}
.entryHeaderSubject {
margin-right: 10px;
font-family: "tahoma", "verdana", sans-serif;
font-size: 8pt;
letter-spacing: 2pt;
font-weight: normal;
text-transform: uppercase;
text-decoration: none;
}
.entryHeaderDate a {
color: #cccccc;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeaderDate a:hover {
color : #c9c9c9;
text-decoration : underline;
}
/*CURRENT MUSIC,MOOD, TAGS & LOCATION IN ENTRIES*/
.entryMetadata {
padding-left: 10px;
display: block;
}
.entryMetadata ul {
margin: 2px;
padding: 0px;
}
.entryMetadata li {
list-style: none;
display: block;
padding-right: 10px;
}
.entryMetadata-label {
font-weight: bold;
padding-right: 4px;
}
/*COMMENT LINKS IN ENTRIES*/
.entryLinkbar {
font-family:"tahoma", "verdana", sans-serif;
font-size: 7pt;
color: #000000;
text-align: right;
padding: 6px 0px 6px 0px;
}
.entryLinkbar ul {
margin: 0px;
padding: 0px;
}
.entryLinkbar li {
padding: 0px 5px 0px 5px;
margin: 5px;
display: inline;
}
/*FOOTER*/
#footer-menu {
font-size: 11px;
}
#footer-menu a, .footer-menu a:visited {
color: #000000;
white-space: nowrap;
padding: 6px;
text-align: left;
}
/*SIDEBAR*/
.sidebar {
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7pt;
margin: 15px 15px 0 15px;
width: 150px;
}
.sidebox {
color: #999999;
background-color: #ffffff;
margin: 4px 0px 4px 0px;
}
.sideboxTitle {
background-color: #ffffff;
border: 1px solid #efefef;
color: #999999;
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
}
.sideboxContent {
text-align: justify;
padding: 2px 4px 2px 4px;
}
.sidebox #profile {
padding: 2px 0px 2px 0px;
text-align: center;
display: yes;
}
.sidebox #search{
margin: 10px 0px 10px 0px;
}
.sidebox #tags_sidebox, .sidebox #tags_sidebox ul, .sidebox #tags_sidebox li {
text-align: center;
margin: 2px;
}
.sidebox #systemlinks {
padding: 5px 5px 5px 5px;
text-align: center;
margin: 2px;
}
.sidebox #latestmonth table{
font-family: "tahoma";
font-size: 7pt!important;
font-color: #999999;
width: 70%;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
padding: 3px;
}
.listtitle {
background-color: #ffffff;
border: 1px solid #efefef;
color: #999999;
font-family: verdana, tahoma, arial, sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
margin-top: 5px;
margin-bottom: 5px;
}
.profile-label {
font-size: 6px
font-weight: bold;
display: none;
}
.profile-content {
font-size: 6px
font-weight: normal;
display: none;
}
/*OTHER PAGES*/
input, textarea, option, select {
background-color: #ffffff;
font: 7pt tahoma,verdana,sans-serif;
color: #999999!important;
border: 1px solid #efefef;
padding: 0px;
margin-top: 1px;
}
/* COMMENT PAGE */
.commentHolder {
border-top: 2px solid #ffffff;
background-color: #ffffff;
border-left: 1px solid #efefef;
border-right: 1px solid #efefef;
margin: 6px 12px 4px 16px;
}
.commentUserinfo {
text-align: center;
margin: 5px 5px 5px 5px;
background-color: #ffffff;
}
.commentUserinfo-usericon img {
border: 0px;
}
.commentText {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7,5pt;
font-color: 999999!important;
text-align: justify;
padding: 6px;
}
.commentHeader {
background-color: #ffffff;
border-width: 1px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
color: #999999;
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
padding: 4px 0px 4px 8px;
}
.commentHeader a{
color: #000000;
}
.commentHeaderScreened {
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
background-color: #ffffff;
border-width: 1px 1px 1px 1px;
border-style: solid;
border-color: #666666;
padding: 4px 0px 4px 8px;
}
.commentHeaderSubject {
font-weight: normal;
}
.commentLinkbar {
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
color: #000000;
text-align: right;
padding-top: 4px;
padding-bottom: 4px;
}
.commentLinkbar ul {
margin: 0px;
padding: 0px;
}
.commentLinkbar li {
padding: 0px 5px 0px 5px;
margin: 0px;
display: inline;
}
.replyform {
background-color: #ffffff;
color: #999999;
padding-left: 10px;
}
#commenttext{
width:100%;
}
/*CALENDAR PAGE*/
.yearlinks{
text-align: right;
}
.yearlink{
padding-left:4px;
padding-right: 4px;
}
.month {
width: 500px;
border: 1px solid #efefef;
margin: 8px 8px 8px 40px;
}
.daysubjects {
color: #999999;
padding: 8px 8px 8px 40px;
}
.daytitles {
text-align: center;
border: 1px solid #efefef;
background: #ffffff;
color: #999999;
}
.day-blank {
border: 1px solid #efefef;
}
.day {
border: 1px solid #efefef;
}
.day-date {
border-right: 1px solid #efefef;
border-bottom: 1px solid #efefef;
color: #999999;
width: 50%;
text-align: center;
}
.day-count {
width: 50%;
text-align: center;
float: right;
font-size: 8pt;
}
.day-count a {
text-decoration: none;
color: #1e90ff;
}
.day-count a:hover{
color: #000000;
}
/*TAGS PAGE*/
.tagstable, .tagstable td {
border: 1px solid #efefef;
}
.tagstable {
width: 90%;
}
Custom Comment Pages Preview
Instalation
1. Go to Manage > Customize
2. In the Basic Tab, Select S2 Under Style System - For users who don't know HTML or CSS, or make only minor alterations. Click Save Changes.
3. In the Look and Feel tab select Smooth Sailing from the drop-down-menu. Unless you want them changed, leave the Language and Theme as default. Save Changes.
4. In the Custom Options tab select the Custom CSS sub-tab:
- Choose NO in the first two drop down menus
- make sure the Custom external stylesheet URL box is BLANK
- Paste in the stylesheet into the Custom stylesheet box
5. Save Changes.
------------------------------------------------------------------------------------------------------------------------
Important Note: To avoid your navigation menu to resize and look messed up, I recommend you to change the menu text to something shorter than the default text.
Example: Replace Recent Entries with Entries, etc.
------------------------------------------------------------------------------------------------------------------------
Customizing the HEADER
You may, if you want, add a header to the layout. I've already placed the codes on the overrides, but there are some small changes you need to
make to set the header properly. This process requires a little HTML/CSS knowledge, but I'm sure anyone can do this right.
A) Everything depends on the width of your layout. This one is 750px.
B) The header css for this specific layout is located under .pageblock in the stylesheet, and it looks like this:
.pageblock{
background-image: url('HEADERURLHERE');
background-position: top center;
background-repeat: no-repeat;
padding-top: 25px;
width:750px;
margin: 0 auto;
}
width: 750px; Should be the width of your header.
padding-top: 25px; This is where you add the height of your header.
-Remember after you enter the URL for the header in the code make sure to also set the width and padding in the stylesheet!
Tiny Icon by _excentric_
Comments are appreciated, if you have any question concerning this layout, drop a comment and I'll get back to you as soon as I can. To see more of my work, feel free to add resplandor to your friend's list. I'm looking forward to have enough members to take Layout Requests
If you take, please comment and don't forget to credit :]
Enjoy!
EDIT: Please check the FAQ section before asking any question, because if it's been answered before, I will ignore it
And to spice things up a little bit, I've decided to make this layout available in 4 different colors, how cool is that huh? I just needed something to do on my week off for easter holidays and I think I've spent this time doing something very productive. Now, onto the layouts.
Style: S2 Smooth Sailing
Website: Not required but it looks better if you define one.
Default Icon: Optional
Best view: 1024x768 and up
Browser(s) Compatible: IE // I didn't test it on Firefox, so let me know if it works ;)
Nav Bar?: Yes
Custom Comment Page?: Yes
Work best with: Free & Paid account
Works okay in: Plus account, but it's always the user's choice.
Click on the image for Full-Size Preview
Grey Layout Overrides
/*---------------------------------------------------
Stylesheet By: Resplandor@livejournal.com
Style: S2 Smooth Sailing
Works best with: Free & Paid accounts
Browser: Firefox and IE
-----------------------------------------------------*/
/* PAGE BODY */
body {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin-bottom: 10px!important;
background-color: #dddddd;
color: #333333;
background-image: url('');
margin-top: 10px;
}
/*HIDES PROTECTED ICON & REPLACES LJ USER ICON*/
.entryHeaderSubject img {
display: none;
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
/* so that IE users will still see an image */
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
;){kind=link}
padding:8px 7px 0 2px;
}
.ljuser img[src="http://stat.livejournal.com/img/userinfo.gif"] {
background-color:transparent;
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding: 8px 7px 0 2px;
}
/* QUOTATION */
blockquote {
margin-left: 15px 15px;
padding: 5px;
border-left: 1px solid #dddddd;
border-right: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
border-top: 1px solid #dddddd;
background-image: url();
background-repeat: repeat;
background-position: top left;
}
/* MAIN LINKS */
a {
color: #000000;
}
a:visited {
color: #000000;
}
a:hover{
color: #999999;
border-bottom: 1px dashed #000000;
}
/*PAGE FOOTER*/
.pagefooterblock {
border: 1px solid #000000;
background-color: #404040;
color: #ffffff;
padding: 4px 4px 4px 24px;
margin-top: 0px;
}
.pagefooterblock a, .pagefooterblock a:visited {
color: #ffffff;
}
/*PAGE HEADER */
.pageblock{
background-image: url('HEADERURLHERE');
background-position: top center;
background-repeat: no-repeat;
padding-top: 25px;
width:750px;
margin: 0 auto;
}
.pageheaderblock {
text-align: center;
}
.header-title {
display: none;
padding: 0px 0px 0px 0px;
}
.header-subtitle {
display:none;
padding: 0px 0px 0px 0px;
}
.header-icon {
top: 0px;
right: 0px;
position: absolute;
z-index: 1;
border-left: 2px solid #ffffff;
border-bottom: 2px solid #ffffff;
}
/*NAVIGATION LINKS*/
.header-menu {
margin-top: 0px;
padding: 8px;
background-color: #404040;
border: 1px solid #000000;
padding-left: auto;
font-family:"tahoma";
font-size: 12px;
text-transform: uppercase;
line-height: 20px;
}
.header-menu a, .header-menu a:visited {
white-space: nowrap;
text-align: center;
padding: 2px 6px 2px 6px;
color: #ffffff;
text-decoration: none;
}
.header-menu a:hover {
background-color: #efefef;
color: #000000;
}
.header-menu ul, #footer-menu ul {
margin: 0px;
padding: 0px;
}
.header-menu li, #footer-menu li {
margin-left: 5px;
margin-right: 5px;
display: inline;
}
/*PREVIOUS/NEXT, BACK TO TOP LINKS*/
.bodyblock {
background-color: #ffffff!important;
padding: 0px 0px 0px 0px;
}
.bodyheaderblock {
border-top: 0px solid #ffffff;
background-color: #efefef;
padding: 0px 0px 0px 0px;
}
.bodynavblock {
font-family: "tahoma", "verdana", sans-serif;
font-size: 12px;
text-align: right;
background-color: #ffffff;
margin: 10px 0px 4px 0px;
padding:15px;
}
.bodynavblock a, .bodynavblock a:visited {
color: #000000!important;
}
.bodynavblock a:hover{
color: #999999!important;
bottom-border: 1px dashed #000000;
}
.body-title {
display: none;
}
.body-midtitle {
display: none;
}
/*ENTRIES*/
.entryHolder {
color: #333333;
background-color: #ffffff;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin: 4px 4px 4px 0px;
}
.entryText {
text-align: justify;
padding: 11px;
}
/*ICON IN ENTRIES*/
.entryUserinfo {
border: 1px solid #efefef;
text-align: center;
padding: 5px 5px 5px 5px;
margin: 5px 5px 5px 5px;
background-color: transparent;
}
.entryUserinfo-usericon img {
border: 0;
}
/*SUBJECT AND DATE IN ENTRIES*/
.entryHeader {
border-bottom:1px solid #efefef;
text-align: right;
background-color: #ffffff;
color: #999999;
font-family:"Tahoma", "verdana", sans-serif;
font-size: 7.5pt;
padding: 5px 7px 5px 7px;
}
.entryHeader a, .entryHeader a:visited {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeader a:hover {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: dolid;
border-color: #efefef;
}
.entryHeaderSubject {
margin-right: 10px;
font-family: "tahoma", "verdana", sans-serif;
font-size: 8pt;
letter-spacing: 2pt;
font-weight: normal;
text-transform: uppercase;
text-decoration: none;
}
.entryHeaderDate a {
color: #cccccc;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeaderDate a:hover {
color : #c9c9c9;
text-decoration : underline;
}
/*CURRENT MUSIC,MOOD, TAGS & LOCATION IN ENTRIES*/
.entryMetadata {
padding-left: 10px;
display: block;
}
.entryMetadata ul {
margin: 2px;
padding: 0px;
}
.entryMetadata li {
list-style: none;
display: block;
padding-right: 10px;
}
.entryMetadata-label {
font-weight: bold;
padding-right: 4px;
}
/*COMMENT LINKS IN ENTRIES*/
.entryLinkbar {
font-family:"tahoma", "verdana", sans-serif;
font-size: 7pt;
color: #000000;
text-align: right;
padding: 6px 0px 6px 0px;
}
.entryLinkbar ul {
margin: 0px;
padding: 0px;
}
.entryLinkbar li {
padding: 0px 5px 0px 5px;
margin: 5px;
display: inline;
}
/*FOOTER*/
#footer-menu {
font-size: 11px;
}
#footer-menu a, .footer-menu a:visited {
color: #000000;
white-space: nowrap;
padding: 6px;
text-align: left;
}
/*SIDEBAR*/
.sidebar {
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7pt;
margin: 15px 15px 0 15px;
width: 150px;
}
.sidebox {
color: #333333;
background-color: #ffffff;
margin: 4px 0px 4px 0px;
}
.sideboxTitle {
background-color: #ffffff;
border: 1px solid #efefef;
color: #333333;
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
}
.sideboxContent {
text-align: justify;
padding: 2px 4px 2px 4px;
}
.sidebox #profile {
padding: 2px 0px 2px 0px;
text-align: center;
display: yes;
}
.sidebox #search{
margin: 10px 0px 10px 0px;
}
.sidebox #tags_sidebox, .sidebox #tags_sidebox ul, .sidebox #tags_sidebox li {
text-align: center;
margin: 2px;
margin-bottom: 10px;
}
.sidebox #systemlinks {
padding: 5px 5px 5px 5px;
text-align: center;
margin: 2px;
}
.sidebox #latestmonth table{
font-family: "tahoma";
font-size: 7pt!important;
font-color: #999999;
width: 70%;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
padding: 3px;
}
.listtitle {
background-color: #ffffff;
border: 1px solid #efefef;
color: #333333;
font-family: verdana, tahoma, arial, sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
margin-top: 5px;
margin-bottom: 5px;
}
.profile-label {
font-size: 6px
font-weight: bold;
display: none;
}
.profile-content {
font-size: 6px
font-weight: normal;
display: none;
}
/*OTHER PAGES*/
input, textarea, option, select {
background-color: #ffffff;
font: 7pt tahoma,verdana,sans-serif;
color: #999999!important;
border: 1px solid #efefef;
padding: 0px;
margin-top: 1px;
}
/* COMMENT PAGE */
.commentHolder {
border-top: 2px solid #ffffff;
background-color: #ffffff;
border-left: 1px solid #efefef;
border-right: 1px solid #efefef;
margin: 6px 12px 4px 16px;
}
.commentUserinfo {
text-align: center;
margin: 5px 5px 5px 5px;
background-color: #ffffff;
}
.commentUserinfo-usericon img {
border: 0px;
}
.commentText {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7,5pt;
font-color: 333333!important;
text-align: justify;
padding: 12px;
}
.commentHeader {
background-color: #ffffff;
border-width: 1px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
color: #333333;
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
padding: 4px 0px 4px 8px;
}
.commentHeader a{
color: #000000;
}
.commentHeaderScreened {
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
background-color: #ffffff;
border-width: 1px 1px 1px 1px;
border-style: solid;
border-color: #666666;
padding: 4px 0px 4px 8px;
}
.commentHeaderSubject {
font-weight: normal;
}
.commentLinkbar {
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
color: #000000;
text-align: right;
padding-top: 4px;
padding-bottom: 4px;
}
.commentLinkbar ul {
margin: 0px;
padding: 0px;
}
.commentLinkbar li {
padding: 0px 5px 0px 5px;
margin: 0px;
display: inline;
}
.replyform {
background-color: #ffffff;
color: #333333;
padding-left: 10px;
}
#commenttext{
width:100%;
}
/*CALENDAR PAGE*/
.yearlinks{
text-align: right;
}
.yearlink{
padding-left:4px;
padding-right: 4px;
}
.month {
width: 500px;
border: 1px solid #efefef;
margin: 8px 8px 8px 40px;
}
.daysubjects {
color: #333333;
padding: 8px 8px 8px 40px;
}
.daytitles {
text-align: center;
border: 1px solid #efefef;
background: #ffffff;
color: #333333;
}
.day-blank {
border: 1px solid #efefef;
}
.day {
border: 1px solid #efefef;
}
.day-date {
border-right: 1px solid #efefef;
border-bottom: 1px solid #efefef;
color: #333333;
width: 50%;
text-align: center;
}
.day-count {
width: 50%;
text-align: center;
float: right;
font-size: 8pt;
}
.day-count a {
text-decoration: none;
color: #000000;
}
.day-count a:hover{
color: #999999;
}
/*TAGS PAGE*/
.tagstable, .tagstable td {
border: 1px solid #efefef;
}
.tagstable {
width: 90%;
}
Click on the image for Full-Size Preview
Pink Layout Overrides
/*---------------------------------------------------
Stylesheet By: Resplandor@livejournal.com
Style: S2 Smooth Sailing
Works best with: Free & Paid accounts
Browser: Firefox and IE
-----------------------------------------------------*/
/* PAGE BODY */
body {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin-bottom: 10px!important;
background-color: #efefef;
color: #999999;
background-image: url('');
margin-top: 10px;
}
/*HIDES PROTECTED ICON & REPLACES LJ USER ICON*/
.entryHeaderSubject img {
display: none;
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
/* so that IE users will still see an image */
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding:8px 7px 0 2px;
}
.ljuser img[src="http://stat.livejournal.com/img/userinfo.gif"] {
background-color:transparent;
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding: 8px 7px 0 2px;
}
/* QUOTATION */
blockquote {
margin-left: 15px 15px;
padding: 5px;
border-left:1px solid #dddddd;
border-right: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
border-top: 1px solid #dddddd;
background-image: url();
background-repeat: repeat;
background-position: top left;
}
/* MAIN LINKS */
a {
color: #000000;
}
a:visited {
color: #000000;
}
a:hover{
color: #ff1493;
border-bottom: 1px dashed #000000;
}
/*PAGE FOOTER*/
.pagefooterblock {
border: 1px solid #ff1493;
background-color: #ff69b4;
color: #ffffff;
padding: 4px 4px 4px 24px;
margin-top: 0px;
}
.pagefooterblock a, .pagefooterblock a:visited {
color: #ffffff;
}
/*PAGE HEADER */
.pageblock{
background-image: url('HEADERURLHERE');
background-position: top center;
background-repeat: no-repeat;
padding-top: 25px;
width:750px;
margin: 0 auto;
}
.pageheaderblock {
text-align:center;
}
.header-title {
display: none;
padding: 0px 0px 0px 0px;
}
.header-subtitle {
display:none;
padding: 0px 0px 0px 0px;
}
.header-icon {
top: 0px;
right: 0px;
position: absolute;
z-index: 1;
border-left: 2px solid #ffffff;
border-bottom: 2px solid #ffffff;
}
/*NAVIGATION LINKS*/
.header-menu {
margin-top: 0px;
padding: 8px;
background-color: #ff69b4;
border: 1px solid #ff1493;
padding-left: auto;
font-family:"tahoma";
font-size: 12px;
text-transform: uppercase;
line-height: 20px;
}
.header-menu a, .header-menu a:visited {
white-space: nowrap;
text-align: center;
padding: 2px 6px 2px 6px;
color: #ffffff;
text-decoration: none;
}
.header-menu a:hover {
background-color: #ffffff;
color: #ff1493;
}
.header-menu ul, #footer-menu ul {
margin: 0px;
padding: 0px;
}
.header-menu li, #footer-menu li {
margin-left: 5px;
margin-right: 5px;
display: inline;
}
/*PREVIOUS/NEXT, BACK TO TOP LINKS*/
.bodyblock {
background-color: #ffffff!important;
padding: 0px 0px 0px 0px;
}
.bodyheaderblock {
border-top: 0px solid #ffffff;
background-color: #efefef;
padding: 0px 0px 0px 0px;
}
.bodynavblock {
font-family: "tahoma", "verdana", sans-serif;
font-size: 12px;
text-align: right;
background-color: #ffffff;
margin: 10px 0px 4px 0px;
padding:15px;
}
.bodynavblock a, .bodynavblock a:visited {
color: #000000!important;
bottom-border: 1px dashed #ff1493;
}
.bodynavblock a:hover{
color: #ff1493!important;
}
.body-title {
display: none;
}
.body-midtitle {
display: none;
}
/*ENTRIES*/
.entryHolder {
color: #999999;
background-color: #ffffff;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin: 4px 4px 4px 0px;
}
.entryText {
text-align: justify;
padding: 6px;
}
/*ICON IN ENTRIES*/
.entryUserinfo {
border: 1px solid #efefef;
text-align: center;
padding: 5px 5px 5px 5px;
margin: 5px 5px 5px 5px;
background-color: transparent;
}
.entryUserinfo-usericon img {
border: 0;
}
/*SUBJECT AND DATE IN ENTRIES*/
.entryHeader {
border-bottom:1px solid #efefef;
text-align: right;
background-color: #ffffff;
color: #999999;
font-family:"Tahoma", "verdana", sans-serif;
font-size: 7.5pt;
padding: 5px 7px 5px 7px;
}
.entryHeader a, .entryHeader a:visited {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeader a:hover {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: dolid;
border-color: #efefef;
}
.entryHeaderSubject {
margin-right: 10px;
font-family: "tahoma", "verdana", sans-serif;
font-size: 8pt;
letter-spacing: 2pt;
font-weight: normal;
text-transform: uppercase;
text-decoration: none;
}
.entryHeaderDate a {
color: #cccccc;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeaderDate a:hover {
color : #c9c9c9;
text-decoration : underline;
}
/*CURRENT MUSIC,MOOD, TAGS & LOCATION IN ENTRIES*/
.entryMetadata {
padding-left: 10px;
display: block;
}
.entryMetadata ul {
margin: 2px;
padding: 0px;
}
.entryMetadata li {
list-style: none;
display: block;
padding-right: 10px;
}
.entryMetadata-label {
font-weight: bold;
padding-right: 4px;
}
/*COMMENT LINKS IN ENTRIES*/
.entryLinkbar {
font-family:"tahoma", "verdana", sans-serif;
font-size: 7pt;
color: #000000;
text-align: right;
padding: 6px 0px 6px 0px;
}
.entryLinkbar ul {
margin: 0px;
padding: 0px;
}
.entryLinkbar li {
padding: 0px 5px 0px 5px;
margin: 5px;
display: inline;
}
/*FOOTER*/
#footer-menu {
font-size: 11px;
}
#footer-menu a, .footer-menu a:visited {
color: #000000;
white-space: nowrap;
padding: 6px;
text-align: left;
}
/*SIDEBAR*/
.sidebar {
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7pt;
margin: 15px 15px 0 15px;
width: 150px;
}
.sidebox {
color: #999999;
background-color: #ffffff;
margin: 4px 0px 4px 0px;
}
.sideboxTitle {
background-color: #ffffff;
border: 1px solid #efefef;
color: #999999;
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
}
.sideboxContent {
text-align: justify;
padding: 2px 4px 2px 4px;
}
.sidebox #profile {
padding: 2px 0px 2px 0px;
text-align: center;
display: yes;
}
.sidebox #search{
margin: 10px 0px 10px 0px;
}
.sidebox #tags_sidebox, .sidebox #tags_sidebox ul, .sidebox #tags_sidebox li {
text-align: center;
margin: 2px;
}
.sidebox #systemlinks {
padding: 5px 5px 5px 5px;
text-align: center;
margin: 2px;
}
.sidebox #latestmonth table{
font-family: "tahoma";
font-size: 7pt!important;
font-color: #999999;
width: 70%;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
padding: 3px;
}
.listtitle {
background-color: #FFFFFF;
border: 1px solid #efefef;
color: #999999;
font-family: verdana, tahoma, arial, sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
margin-top: 5px;
margin-bottom: 5px;
}
.profile-label {
font-size: 6px
font-weight: bold;
display: none;
}
.profile-content {
font-size: 6px
font-weight: normal;
display: none;
}
/*OTHER PAGES*/
input, textarea, option, select {
background-color: #FFFFFF;
font: 7pt tahoma,verdana,sans-serif;
color: #999999!important;
border: 1px solid #efefef;
padding: 0px;
margin-top: 1px;
}
/* COMMENT PAGE */
.commentHolder {
border-top: 2px solid #ffffff;
background-color: #ffffff;
border-left: 1px solid #efefef;
border-right: 1px solid #efefef;
margin: 6px 12px 4px 16px;
}
.commentUserinfo {
text-align: center;
margin: 5px 5px 5px 5px;
background-color: #ffffff;
}
.commentUserinfo-usericon img {
border: 0px;
}
.commentText {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7,5pt;
font-color: 999999!important;
text-align: justify;
padding: 6px;
}
.commentHeader {
background-color: #ffffff;
border-width: 1px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
color: #999999;
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
padding: 4px 0px 4px 8px;
}
.commentHeader a{
color: #000000;
}
.commentHeaderScreened {
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
background-color: #ffffff;
border-width: 1px 1px 1px 1px;
border-style: solid;
border-color: #666666;
padding: 4px 0px 4px 8px;
}
.commentHeaderSubject {
font-weight: normal;
}
.commentLinkbar {
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
color: #000000;
text-align: right;
padding-top: 4px;
padding-bottom: 4px;
}
.commentLinkbar ul {
margin: 0px;
padding: 0px;
}
.commentLinkbar li {
padding: 0px 5px 0px 5px;
margin: 0px;
display: inline;
}
.replyform {
background-color: #ffffff;
color: #999999;
padding-left: 10px;
}
#commenttext{
width:100%;
}
/*CALENDAR PAGE*/
.yearlinks{
text-align: right;
}
.yearlink{
padding-left:4px;
padding-right: 4px;
}
.month {
width: 500px;
border: 1px solid #efefef;
margin: 8px 8px 8px 40px;
}
.daysubjects {
color: #999999;
padding: 8px 8px 8px 40px;
}
.daytitles {
text-align: center;
border: 1px solid #efefef;
background: #ffffff;
color: #999999;
}
.day-blank {
border: 1px solid #efefef;
}
.day {
border: 1px solid #efefef;
}
.day-date {
border-right: 1px solid #efefef;
border-bottom: 1px solid #efefef;
color: #999999;
width: 50%;
text-align: center;
}
.day-count {
width: 50%;
text-align: center;
float: right;
font-size: 8pt;
}
.day-count a {
text-decoration: none;
color: #000000;
}
.day-count a:hover{
color: #ff1493;
}
/*TAGS PAGE*/
.tagstable, .tagstable td {
border: 1px solid #efefef;
}
.tagstable {
width: 90%;
}
Click on the image for Full-Size Preview
Purple Layout Overrides
/*---------------------------------------------------
Stylesheet By: Resplandor@livejournal.com
Style: S2 Smooth Sailing
Works best with: Free & Paid accounts
Browser: Firefox and IE
-----------------------------------------------------*/
/* PAGE BODY */
body {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin-bottom: 10px!important;
background-color: #efefef;
color: #333333;
background-image: url('');
margin-top: 10px;
}
/*HIDES PROTECTED ICON & REPLACES LJ USER ICON*/
.entryHeaderSubject img {
display: none;
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
/* so that IE users will still see an image */
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding:8px 7px 0 2px;
}
.ljuser img[src="http://stat.livejournal.com/img/userinfo.gif"] {
background-color:transparent;
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding: 8px 7px 0 2px;
}
/* QUOTATION */
blockquote {
margin-left: 15px 15px;
padding: 5px;
border-left: 1px solid #efefef;
border-right: 1px solid #efefef;
border-bottom: 1px solid #efefef;
border-top: 1px solid #efefef;
background-image: url();
background-repeat: repeat;
background-position: top left;
}
/* MAIN LINKS */
a {
color: #000000;
}
a:visited {
color: #000000;
}
a:hover{
color: #8A5AEB;
border-bottom: 1px dashed #9400d3;
}
/*PAGE FOOTER*/
.pagefooterblock {
background-color: #9E81D9;
border: 1px solid #9932cc;
color: #ffffff;
padding: 4px 4px 4px 24px;
margin-top: 0px;
}
.pagefooterblock a, .pagefooterblock a:visited {
color: #ffffff;
}
/*PAGE HEADER */
.pageblock{
background-image: url('HEADERURLHERE');
background-position: top center;
background-repeat: no-repeat;
padding-top: 25px;
width:750px;
margin: 0 auto;
}
.pageheaderblock {
text-align: center;
}
.header-title {
display: none;
padding: 0px 0px 0px 0px;
}
.header-subtitle {
display:none;
padding: 0px 0px 0px 0px;
}
.header-icon {
top: 0px;
right: 0px;
position: absolute;
z-index: 1;
border-left: 2px solid #ffffff;
border-bottom: 2px solid #ffffff;
}
/*NAVIGATION LINKS*/
.header-menu {
margin-top: 0px;
padding: 8px;
background-color: #9E81D9;
border: 1px solid #9932cc;
padding-left: auto;
font-family:"tahoma";
font-size: 12px;
text-transform: uppercase;
line-height: 20px;
}
.header-menu a, .header-menu a:visited {
white-space: nowrap;
text-align: center;
padding: 2px 6px 2px 6px;
color: #ffffff;
text-decoration: none;
}
.header-menu a:hover {
background-color: #ffffff;
color: #9932cc;
}
.header-menu ul, #footer-menu ul {
margin: 0px;
padding: 0px;
}
.header-menu li, #footer-menu li {
margin-left: 5px;
margin-right: 5px;
display: inline;
}
/*PREVIOUS/NEXT, BACK TO TOP LINKS*/
.bodyblock {
background-color: #ffffff!important;
padding: 0px 0px 0px 0px;
}
.bodyheaderblock {
border-top: 0px solid #ffffff;
background-color: #efefef;
padding: 0px 0px 0px 0px;
}
.bodynavblock {
font-family: "tahoma", "verdana", sans-serif;
font-size: 12px;
text-align: right;
background-color: #ffffff;
margin: 10px 0px 4px 0px;
padding:15px;
}
.bodynavblock a, .bodynavblock a:visited {
color: #000000!important;
}
.bodynavblock a:hover{
color: #8A5AEB!important;
}
.body-title {
display: none;
}
.body-midtitle {
display: none;
}
/*ENTRIES*/
.entryHolder {
color: #333333;
background-color: #ffffff;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin: 4px 4px 4px 0px;
}
.entryText {
text-align: justify;
padding: 6px;
}
/*ICON IN ENTRIES*/
.entryUserinfo {
border: 1px solid #efefef;
text-align: center;
padding: 5px 5px 5px 5px;
margin: 5px 5px 5px 5px;
background-color: transparent;
}
.entryUserinfo-usericon img {
border: 0;
}
/*SUBJECT AND DATE IN ENTRIES*/
.entryHeader {
border-bottom:1px solid #efefef;
text-align: right;
background-color: #ffffff;
color: #333333;
font-family:"Tahoma", "verdana", sans-serif;
font-size: 7.5pt;
padding: 5px 7px 5px 7px;
}
.entryHeader a, .entryHeader a:visited {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeader a:hover {
color: #000000;
border-width: 0px 0px 1px 0px;
border-style: dolid;
border-color: #efefef;
}
.entryHeaderSubject {
margin-right: 10px;
font-family: "tahoma", "verdana", sans-serif;
font-size: 8pt;
letter-spacing: 2pt;
font-weight: normal;
text-transform: uppercase;
text-decoration: none;
}
.entryHeaderDate a {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeaderDate a:hover {
color : #000000;
text-decoration : underline;
}
/*CURRENT MUSIC,MOOD, TAGS & LOCATION IN ENTRIES*/
.entryMetadata {
padding-left: 10px;
display: block;
}
.entryMetadata ul {
margin: 2px;
padding: 0px;
}
.entryMetadata li {
list-style: none;
display: block;
padding-right: 10px;
}
.entryMetadata-label {
font-weight: bold;
padding-right: 4px;
}
/*COMMENT LINKS IN ENTRIES*/
.entryLinkbar {
font-family:"tahoma", "verdana", sans-serif;
font-size: 7pt;
color: #000000;
text-align: right;
padding: 6px 0px 6px 0px;
}
.entryLinkbar ul {
margin: 0px;
padding: 0px;
}
.entryLinkbar li {
padding: 0px 5px 0px 5px;
margin: 5px;
display: inline;
}
/*FOOTER*/
#footer-menu {
font-size: 11px;
}
#footer-menu a, .footer-menu a:visited {
color: #000000;
white-space: nowrap;
padding: 6px;
text-align: left;
}
/*SIDEBAR*/
.sidebar {
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7pt;
margin: 15px 15px 0 15px;
width: 150px;
}
.sidebox {
color: #333333;
background-color: #ffffff;
margin: 4px 0px 4px 0px;
}
.sideboxTitle {
background-color: #ffffff;
border: 1px solid #efefef;
color: #333333;
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
}
.sideboxContent {
text-align: justify;
padding: 2px 4px 2px 4px;
}
.sidebox #profile {
padding: 2px 0px 2px 0px;
text-align: center;
display: yes;
}
.sidebox #search{
margin: 10px 0px 10px 0px;
}
.sidebox #tags_sidebox, .sidebox #tags_sidebox ul, .sidebox #tags_sidebox li {
text-align: center;
margin: 2px;
}
.sidebox #systemlinks {
padding: 5px 5px 5px 5px;
text-align: center;
margin: 2px;
}
.sidebox #latestmonth table{
font-family: "tahoma";
font-size: 7pt!important;
color: #939393!important;
width: 70%;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
padding: 3px;
}
.listtitle {
background-color: #ffffff;
border: 1px solid #efefef;
color: #333333;
font-family: verdana, tahoma, arial, sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
margin-top: 5px;
margin-bottom: 5px;
}
.profile-label {
font-size: 6px
font-weight: bold;
display: none;
}
.profile-content {
font-size: 6px
font-weight: normal;
display: none;
}
/*OTHER PAGES*/
input, textarea, option, select {
background-color: #ffffff;
font: 7pt tahoma,verdana,sans-serif;
color: #999999!important;
border: 1px solid #efefef;
padding: 0px;
margin-top: 1px;
}
/* COMMENT PAGE */
.commentHolder {
border-top: 2px solid #ffffff;
background-color: #ffffff;
border-left: 1px solid #efefef;
border-right: 1px solid #efefef;
margin: 6px 12px 4px 16px;
}
.commentUserinfo {
text-align: center;
margin: 5px 5px 5px 5px;
background-color: #ffffff;
}
.commentUserinfo-usericon img {
border: 0px;
}
.commentText {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7,5pt;
font-color: 999999!important;
text-align: justify;
padding: 6px;
}
.commentHeader {
background-color: #ffffff;
border-width: 1px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
color: #999999;
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
padding: 4px 0px 4px 8px;
}
.commentHeader a{
color: #000000;
}
.commentHeaderScreened {
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
background-color: #ffffff;
border-width: 1px 1px 1px 1px;
border-style: solid;
border-color: #666666;
padding: 4px 0px 4px 8px;
}
.commentHeaderSubject {
font-weight: normal;
}
.commentLinkbar {
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
color: #000000;
text-align: right;
padding-top: 4px;
padding-bottom: 4px;
}
.commentLinkbar ul {
margin: 0px;
padding: 0px;
}
.commentLinkbar li {
padding: 0px 5px 0px 5px;
margin: 0px;
display: inline;
}
.replyform {
background-color: #ffffff;
color: #999999;
padding-left: 10px;
}
#commenttext{
width:100%;
}
/*CALENDAR PAGE*/
.yearlinks{
text-align: right;
}
.yearlink{
padding-left:4px;
padding-right: 4px;
}
.month {
width: 500px;
border: 1px solid #efefef;
margin: 8px 8px 8px 40px;
}
.daysubjects {
color: #999999;
padding: 8px 8px 8px 40px;
}
.daytitles {
text-align: center;
border: 1px solid #efefef;
background: #ffffff;
color: #999999;
}
.day-blank {
border: 1px solid #efefef;
}
.day {
border: 1px solid #efefef;
}
.day-date {
border-right: 1px solid #efefef;
border-bottom: 1px solid #efefef;
color: #999999;
width: 50%;
text-align: center;
}
.day-count {
width: 50%;
text-align: center;
float: right;
font-size: 8pt;
}
.day-count a {
text-decoration: none;
color: #000000;
}
.day-count a:hover{
color: #8A5AEB;
}
/*TAGS PAGE*/
.tagstable, .tagstable td {
border: 1px solid #efefef;
}
.tagstable {
width: 90%;
}
Click on the image for Full-Size Preview
Blue Layout Overrides
/*---------------------------------------------------
Stylesheet By: Resplandor@livejournal.com
Style: S2 Smooth Sailing
Works best with: Free & Paid accounts
Browser: Firefox and IE
-----------------------------------------------------*/
/* PAGE BODY */
body {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin-bottom: 10px!important;
background-color: #efefef;
color: #999999;
background-image: url('');
margin-top: 10px;
}
/*HIDES PROTECTED ICON & REPLACES LJ USER ICON*/
.entryHeaderSubject img {
display: none;
}
.ljuser img {
width: 0;
height: 0;
background-repeat: no-repeat;
background-color:transparent;
/* so that IE users will still see an image */
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding:8px 7px 0 2px;
}
.ljuser img[src="http://stat.livejournal.com/img/userinfo.gif"] {
background-color:transparent;
background-image: url(http://img262.imageshack.us/img262/3589/usergreybyexcentriclk2.gif);
padding: 8px 7px 0 2px;
}
/* QUOTATION */
blockquote {
margin-left: 20px 20px;
padding: 5px;
border-left: 1px solid #dddddd;
border-right: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
border-top: 1px solid #dddddd;
background-image: url();
background-repeat: repeat;
background-position: top left;
}
/* MAIN LINKS */
a {
color: #404040;
}
a:visited {
color: #404040;
}
a:hover{
color: #87cefa;
border-bottom: 1px dashed #000000;
}
/*PAGE FOOTER*/
.pagefooterblock {
border: 1px solid #00bfff;
background-color: #87cefa;
color: #ffffff;
padding: 4px 4px 4px 24px;
margin-top: 0px;
}
.pagefooterblock a, .pagefooterblock a:visited {
color: #ffffff;
}
/*PAGE HEADER */
.pageblock{
background-image: url('HEADERURLHERE');
background-position: top center;
background-repeat: no-repeat;
padding-top: 25px;
width:750px;
margin: 0 auto;
}
.pageheaderblock {
text-align: center;
}
.header-title {
display: none;
padding: 0px 0px 0px 0px;
}
.header-subtitle {
display:none;
padding: 0px 0px 0px 0px;
}
.header-icon {
top: 0px;
right: 0px;
position: absolute;
z-index: 1;
border-left: 2px solid #ffffff;
border-bottom: 2px solid #ffffff;
}
/*NAVIGATION LINKS*/
.header-menu {
margin-top: 0px;
padding: 8px;
background-color: #87cefa;
border: 1px solid #00bfff;
padding-left: auto;
font-family:"tahoma";
font-size: 12px;
text-transform: uppercase;
line-height: 20px;
}
.header-menu a, .header-menu a:visited {
white-space: nowrap;
text-align: center;
padding: 2px 6px 2px 6px;
color: #ffffff;
text-decoration: none;
}
.header-menu a:hover {
background-color: #ffffff;
color: #1e90ff;
}
.header-menu ul, #footer-menu ul {
margin: 0px;
padding: 0px;
}
.header-menu li, #footer-menu li {
margin-left: 5px;
margin-right: 5px;
display: inline;
}
/*PREVIOUS/NEXT, BACK TO TOP LINKS*/
.bodyblock {
background-color: #ffffff!important;
padding: 0px 0px 0px 0px;
}
.bodyheaderblock {
border-top: 0px solid #ffffff;
background-color: #efefef;
padding: 0px 0px 0px 0px;
}
.bodynavblock {
font-family: "tahoma", "verdana", sans-serif;
font-size: 12px;
text-align: right;
background-color: #ffffff;
margin: 10px 0px 4px 0px;
padding:15px;
}
.bodynavblock a, .bodynavblock a:visited {
color: #000000!important;
}
.bodynavblock a:hover{
color: #1e90ff!important;
}
.body-title {
display: none;
}
.body-midtitle {
display: none;
}
/*ENTRIES*/
.entryHolder {
color: #999999;
background-color: #ffffff;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
margin: 4px 4px 4px 0px;
}
.entryText {
text-align: justify;
padding: 6px;
}
/*ICON IN ENTRIES*/
.entryUserinfo {
border: 1px solid #efefef;
text-align: center;
padding: 5px 5px 5px 5px;
margin: 5px 5px 5px 5px;
background-color: transparent;
}
.entryUserinfo-usericon img {
border: 0;
}
/*SUBJECT AND DATE IN ENTRIES*/
.entryHeader {
border-bottom:1px solid #efefef;
text-align: right;
background-color: #ffffff;
color: #999999;
font-family:"Tahoma", "verdana", sans-serif;
font-size: 7.5pt;
padding: 5px 7px 5px 7px;
}
.entryHeader a, .entryHeader a:visited {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeader a:hover {
color: #999999;
border-width: 0px 0px 1px 0px;
border-style: dolid;
border-color: #efefef;
}
.entryHeaderSubject {
margin-right: 10px;
font-family: "tahoma", "verdana", sans-serif;
font-size: 8pt;
letter-spacing: 2pt;
font-weight: normal;
text-transform: uppercase;
text-decoration: none;
}
.entryHeaderDate a {
color: #cccccc;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
text-decoration: none;
font-weight: normal;
}
.entryHeaderDate a:hover {
color : #c9c9c9;
text-decoration : underline;
}
/*CURRENT MUSIC,MOOD, TAGS & LOCATION IN ENTRIES*/
.entryMetadata {
padding-left: 10px;
display: block;
}
.entryMetadata ul {
margin: 2px;
padding: 0px;
}
.entryMetadata li {
list-style: none;
display: block;
padding-right: 10px;
}
.entryMetadata-label {
font-weight: bold;
padding-right: 4px;
}
/*COMMENT LINKS IN ENTRIES*/
.entryLinkbar {
font-family:"tahoma", "verdana", sans-serif;
font-size: 7pt;
color: #000000;
text-align: right;
padding: 6px 0px 6px 0px;
}
.entryLinkbar ul {
margin: 0px;
padding: 0px;
}
.entryLinkbar li {
padding: 0px 5px 0px 5px;
margin: 5px;
display: inline;
}
/*FOOTER*/
#footer-menu {
font-size: 11px;
}
#footer-menu a, .footer-menu a:visited {
color: #000000;
white-space: nowrap;
padding: 6px;
text-align: left;
}
/*SIDEBAR*/
.sidebar {
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7pt;
margin: 15px 15px 0 15px;
width: 150px;
}
.sidebox {
color: #999999;
background-color: #ffffff;
margin: 4px 0px 4px 0px;
}
.sideboxTitle {
background-color: #ffffff;
border: 1px solid #efefef;
color: #999999;
font-family: "verdana", "tahoma", "arial", sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
}
.sideboxContent {
text-align: justify;
padding: 2px 4px 2px 4px;
}
.sidebox #profile {
padding: 2px 0px 2px 0px;
text-align: center;
display: yes;
}
.sidebox #search{
margin: 10px 0px 10px 0px;
}
.sidebox #tags_sidebox, .sidebox #tags_sidebox ul, .sidebox #tags_sidebox li {
text-align: center;
margin: 2px;
}
.sidebox #systemlinks {
padding: 5px 5px 5px 5px;
text-align: center;
margin: 2px;
}
.sidebox #latestmonth table{
font-family: "tahoma";
font-size: 7pt!important;
font-color: #999999;
width: 70%;
margin-left: auto;
margin-right: auto;
margin-top: 4px;
padding: 3px;
}
.listtitle {
background-color: #ffffff;
border: 1px solid #efefef;
color: #999999;
font-family: verdana, tahoma, arial, sans-serif;
font-size: 7.5pt;
text-transform: uppercase;
text-align: center;
padding: 6px 4px 6px 4px;
margin-top: 5px;
margin-bottom: 5px;
}
.profile-label {
font-size: 6px
font-weight: bold;
display: none;
}
.profile-content {
font-size: 6px
font-weight: normal;
display: none;
}
/*OTHER PAGES*/
input, textarea, option, select {
background-color: #ffffff;
font: 7pt tahoma,verdana,sans-serif;
color: #999999!important;
border: 1px solid #efefef;
padding: 0px;
margin-top: 1px;
}
/* COMMENT PAGE */
.commentHolder {
border-top: 2px solid #ffffff;
background-color: #ffffff;
border-left: 1px solid #efefef;
border-right: 1px solid #efefef;
margin: 6px 12px 4px 16px;
}
.commentUserinfo {
text-align: center;
margin: 5px 5px 5px 5px;
background-color: #ffffff;
}
.commentUserinfo-usericon img {
border: 0px;
}
.commentText {
font-family: "tahoma", "verdana", sans-serif;
font-size: 7,5pt;
font-color: 999999!important;
text-align: justify;
padding: 6px;
}
.commentHeader {
background-color: #ffffff;
border-width: 1px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
color: #999999;
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
padding: 4px 0px 4px 8px;
}
.commentHeader a{
color: #000000;
}
.commentHeaderScreened {
font-family:"tahoma", "verdana", sans-serif;
font-size: 8pt;
background-color: #ffffff;
border-width: 1px 1px 1px 1px;
border-style: solid;
border-color: #666666;
padding: 4px 0px 4px 8px;
}
.commentHeaderSubject {
font-weight: normal;
}
.commentLinkbar {
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #efefef;
font-family:"tahoma", "verdana", sans-serif;
font-size: 7.5pt;
color: #000000;
text-align: right;
padding-top: 4px;
padding-bottom: 4px;
}
.commentLinkbar ul {
margin: 0px;
padding: 0px;
}
.commentLinkbar li {
padding: 0px 5px 0px 5px;
margin: 0px;
display: inline;
}
.replyform {
background-color: #ffffff;
color: #999999;
padding-left: 10px;
}
#commenttext{
width:100%;
}
/*CALENDAR PAGE*/
.yearlinks{
text-align: right;
}
.yearlink{
padding-left:4px;
padding-right: 4px;
}
.month {
width: 500px;
border: 1px solid #efefef;
margin: 8px 8px 8px 40px;
}
.daysubjects {
color: #999999;
padding: 8px 8px 8px 40px;
}
.daytitles {
text-align: center;
border: 1px solid #efefef;
background: #ffffff;
color: #999999;
}
.day-blank {
border: 1px solid #efefef;
}
.day {
border: 1px solid #efefef;
}
.day-date {
border-right: 1px solid #efefef;
border-bottom: 1px solid #efefef;
color: #999999;
width: 50%;
text-align: center;
}
.day-count {
width: 50%;
text-align: center;
float: right;
font-size: 8pt;
}
.day-count a {
text-decoration: none;
color: #1e90ff;
}
.day-count a:hover{
color: #000000;
}
/*TAGS PAGE*/
.tagstable, .tagstable td {
border: 1px solid #efefef;
}
.tagstable {
width: 90%;
}
Custom Comment Pages Preview
Instalation
1. Go to Manage > Customize
2. In the Basic Tab, Select S2 Under Style System - For users who don't know HTML or CSS, or make only minor alterations. Click Save Changes.
3. In the Look and Feel tab select Smooth Sailing from the drop-down-menu. Unless you want them changed, leave the Language and Theme as default. Save Changes.
4. In the Custom Options tab select the Custom CSS sub-tab:
- Choose NO in the first two drop down menus
- make sure the Custom external stylesheet URL box is BLANK
- Paste in the stylesheet into the Custom stylesheet box
5. Save Changes.
------------------------------------------------------------------------------------------------------------------------
Important Note: To avoid your navigation menu to resize and look messed up, I recommend you to change the menu text to something shorter than the default text.
Example: Replace Recent Entries with Entries, etc.
------------------------------------------------------------------------------------------------------------------------
Customizing the HEADER
You may, if you want, add a header to the layout. I've already placed the codes on the overrides, but there are some small changes you need to
make to set the header properly. This process requires a little HTML/CSS knowledge, but I'm sure anyone can do this right.
A) Everything depends on the width of your layout. This one is 750px.
B) The header css for this specific layout is located under .pageblock in the stylesheet, and it looks like this:
.pageblock{
background-image: url('HEADERURLHERE');
background-position: top center;
background-repeat: no-repeat;
padding-top: 25px;
width:750px;
margin: 0 auto;
}
width: 750px; Should be the width of your header.
padding-top: 25px; This is where you add the height of your header.
-Remember after you enter the URL for the header in the code make sure to also set the width and padding in the stylesheet!
Tiny Icon by _excentric_
Comments are appreciated, if you have any question concerning this layout, drop a comment and I'll get back to you as soon as I can. To see more of my work, feel free to add resplandor to your friend's list. I'm looking forward to have enough members to take Layout Requests
If you take, please comment and don't forget to credit :]
Enjoy!
EDIT: Please check the FAQ section before asking any question, because if it's been answered before, I will ignore it