S2 Smooth Sailing

[writing_light]

Layout Style: Smooth Sailing
Best view: 1024x768 and higher
Browser(s) Compatible: Tested with FF and IE7
Work with Nav bar?: Yes
Work with Ads? Yes but I would use horizontal only
Credit: writing_light or losing_light somewhere in your journal please
Notes: This layout requires both a title and subtitle to work correctly.
Preview:

Live preview: Recent entries*Archive* Tags*Custom Comments



Image(s): All the images are hosted on my Photobucket account. If you'd like to host them yourself, here are the direct links.

Title and menu box
Entry top
Entry middle
Entry bottom
Sidebox top
Sidebox middle
Sidebox bottom
Footer
Comment navigation and Comment bar

Main poll bar
Right poll bar
Left poll bar

mini icons from the Icon Archive.
Private user icon
Community user icon
User icon
Friends locked icon
Friends filtered icon

Directions:
Go to Customize Journal
Choose any Smooth Sailing layout
Choose sidebar on right
Hit Customize Selected Theme
Under display choose Additional options and the Yes for Wrap Entry text under userinfo Save Changes
Choose Custom CSS
Make sure both drop down boxes say no
Copy the overrides in the box below and paste them into the Custom Stylesheet hit Save Changes

If you would like to add a header, find /* Add your header here */ in the overrides and follow the directions. The header will appear below the title/menu.

Overrides:
/*

** Layout by LJ user writing-light at writing-
light.livejournal.com
** S2 Smooth Sailing
** contextual Popup coding by lj user cartonage
** mini icons from www.iconarchive.com

** please do not remove credit */

html body {
margin: 0 auto !important;
}

.header-subtitle, .entryText, .entryMetadata, .listtitle, .commentHeader, .commentHeaderScreened, .daytitles, .tagstable td {
border-bottom: 1px dashed #808080;

}

.tagstable, .entryUserinfo-usericon img, textarea, input, select, blockquote, .profile-userpic, .commentHolder, .commentUserinfo-usericon img, .month {
border: 1px solid #808080;
}

body, .entryLinkbar, .sidebox #profile, .latestmonth-inactive, .latestmonth-active, .commentUserinfo, .commentLinkbar, .daytitles, .day-date, .day-count {
text-align: center;
}

body {
background-color: #fff;
color: #808080;
font-size: 11px;
margin: 0 auto;
width: 958px;
}

.pageblock {
background: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/stark/header.png) no-repeat top center #fff;
margin-top: 20px;
}

/* Add your header here */
.pageheaderblock {
background: url(YOUR HEADERS URL) no-repeat bottom center;
height: YOUR HEADERS HEIGHT PLUS 150px;
margin-bottom: 23px;
}

.header-icon, .body-title, .profile-label {
display: none;
}

.header-title {
font-size: 22px;
padding-top: 28px;
}

.header-subtitle {
font-size: 18px;
margin: 0 45px;
padding-bottom: 10px;
}

.header-menu, #footer-menu {
font-size: 14px;
padding: 10px;
text-transform: capitalize;
white-space: nowrap;
}

.header-menu a, .header-menu a:visited, #footer-menu a, #footer-menu a:visited {
display: inline;
padding: 0 5px;
}

.header-menu ul, #footer-menu ul, .entryMetadata ul, .entryLinkbar ul, .commentLinkbar ul, .commentHeaderScreened {
margin: 0;
padding: 0;
}

.header-menu li, #footer-menu li {
display: inline;
}

.entryHolder {
background: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/stark/entrymiddle.png) repeat-y center;
text-align: left;
width: 762px;
}

.entryHeader {
background: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/stark/entrytop.png) no-repeat top center;
height: 44px;
padding: 25px 0 0 32px;
}

.entryHeaderSubject {
display: block;
font-size: 16px;
}

.entryHeaderDate {
font-size: 10px;
}

.entryUserinfo {
margin: 0 5px 3px 32px;
position: relative;
}

.entryUserinfo-usericon img {
padding: 1px;
}

div.ContextualPopup {
font-family: arial, helvetica, sans-serif !important;
font-size: 11px;
font-style: normal;
margin: 5px 0 0 20px;
}

div.ContextualPopup img {
border: 2px solid #4344c0;
}

div.ContextualPopup div.Inner {
background-color: #fff !important;
border: 1px solid #009966;
color: #4344c0 !important;
padding: 0;
width: 20em;
}

div.ContextualPopup .Content {
line-height: 1.4;
margin-right: 50px;
padding: 2px 4px 6px 4px;
}

div.ContextualPopup .Relation {
font-weight: bold !important;
}

div.ContextualPopup .Content .OnlineStatus {
font-weight: bold;
}

div.ContextualPopup .Userpic {
padding: 4px 4px 0 0;
}

div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
color: #009966 !important;
font-weight: bold;
text-decoration: underline !important;
}

div.ContextualPopup div.Inner a:hover {
color: #4344c0 !important;
text-decoration: underline !important;
}

.entryText {
border-top: 1px dashed #808080;
margin: -11px 28px 5px 32px;
min-height: 130px;
padding: 10px 0;
}

.entryText img {
max-width: 700px;
}

a, a:visited, .entryMetadata a:hover, .latestmonth-active a:hover {
color: #4344c0;
}

a, a:visited {
font-weight: bold;
text-decoration: none;
}

a:hover, sup, sub, i, .entryMetadata a, .entryMetadata a:visited, .latestmonth-active a {
color: #009966;
}

a:hover {
font-weight: bold;
text-decoration: none;
}

code, kbd, pre, tt {
font-family: monospace;
}

::-moz-selection {
background-color: #808080;
color: #fff;
}

textarea {
padding: 2px 0 2px 2px;
}

input, select {
margin-top: 2px;

}

blockquote {
padding: 10px;
}

.entryMetadata {
margin: 0 28px 0 32px;
padding: 5px 0;
}

.entryMetadata img {
padding-left: 3px;
}

.entryMetadata li {
display: block;
list-style-image: none;
list-style-position: outside;
list-style-type: none;
}

.entryMetadata-label {
font-weight: bold;
padding-right: 5px;
}

.entryLinkbar {
background: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/stark/entrybottom.png) no-repeat center bottom;

height: 52px;
padding: 15px 32px 0 32px;
}

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

.sidebar {
width: 200px;
}

.sidebox {
background: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/stark/sideboxbottom.png) no-repeat bottom;
padding-bottom: 44px;
}

.sideboxTitle {
background: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/stark/sideboxtop.png) no-repeat center top;
height: 44px;
padding-top: 25px;
}

.sideboxContent {
background: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/stark/sideboxmiddle.png) repeat-y center;
margin-top: -25px;
padding: 0 32px;
text-align: left;
}

.sidebox #tags_sidebox {
text-align: justify;
}

.listtitle {
margin-right: 6px;
}

#SearchTerm {
width: 98%;
}

.sidebox #latestmonth {
margin-top: -25px;
padding: 3px 0 0 41px;
}

.latestmonth-inactive {
margin: 1px;
padding: 1px;
}

.latestmonth-active a {
font-size: 13px;
}

#footer-menu {
background: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/stark/footer.png) no-repeat top;
height: 96px;
padding-top: 40px;
}

.pagefooterblock {
margin: -30px 195px 0 0;
}

.bodynavblock, .body-midtitle {
background: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/stark/mid.png) no-repeat top;
height: 65px;
}

.bodynavblock {
padding-top: 18px;
}

.body-midtitle {
margin: -10px 0 -26px;
padding-top: 23px;
}

.commentHolder {
margin: 10px 20px 10px 23px;
text-align: justify;
}

.commentHeader, .commentHeaderScreened {
font-size: 14px;
margin: 0 10px;
padding: 10px 0 0 5px;
text-transform: capitalize;
}

.commentHeaderScreened {
border-top: 20px solid #009966;
margin: 0px;
}

.commentUserinfo {
margin: 5px 5px 5px 10px;
}

.commentText {
margin: 5px 11px 5px;
}

.commentLinkbar li {
display: inline;
padding: 0 5px;
}

#qrform table {
border: none !important;
}

#commenttext {
width: 100%;
}

.yearlinks {
text-align: right;
}

.yearlink {
padding: 0 4px;
}

.daysubjects {
margin-left: 32px;
}

.month {
margin-left: 32px;
padding: 4px;
width: 700px;
}

.day {
padding-top: 2px;
}

.day-date {
background-color: #808080;
color: #fff;
width: 95%;
}

.day-count {
font-size: 20px;
}

.tagstable td {
margin: 13px 0;
}

.tagstable {
padding-bottom: 4px;
width: 700px;
}

#summary img {
border: 0;
width: 0;
height: 0;
background-repeat: no-repeat;
}

#summary img[src="http://p-stat.livejournal.com/img/icon_protected.gif"] {
border: 0;
background-image: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/miniicons/Cloud-16x16.png);
padding: 15px 15px 0 0;
}

.entryHeader img {
background-image: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/miniicons/Cloud-16x16.png);
background-repeat: no-repeat;
height: 0;
padding: 16px 16px 0 0 !important;
width: 0;
}

.entryHeader img[src="http://p-stat.livejournal.com/img/icon_protected.gif"] {
background: transparent url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/miniicons/Cloud-16x16.png) repeat scroll 0%;
height: 0;
padding: 16px 16px 0 0 !important;
width: 0;
}

#summary img[src="http://p-stat.livejournal.com/img/icon_private.gif"] {
border: 0;
background-image: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/miniicons/Cloud-Sun-16x16.png);
padding: 14px 14px 0 0;
}

.entryHeader img[src="http://p-stat.livejournal.com/img/icon_private.gif"] {
background: transparent url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/miniicons/Cloud-Sun-16x16.png) repeat scroll 0%;
height: 0;
padding: 15px 14px 0 0 !important;
width: 0;
}

#summary img[src="http://p-stat.livejournal.com/img/icon_groups.gif"] {
border: 0;
background-image: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/miniicons/Tree-16x16.png);
padding: 16px 16px 0 0;

}

.entryHeader img[src="http://p-stat.livejournal.com/img/icon_groups.gif"] {
background: transparent url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/miniicons/Tree-16x16.png) repeat scroll 0%;
height: 0;
padding: 16px 16px 0 0 !important;

width: 0;
}

.ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] {
background-image: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/miniicons/Green-Butterfly-16x16.png);
padding: 16px 16px 0 0 !important;
}

.ljuser img {
background-image: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/miniicons/Blue-Flower-16x16.png);
background-repeat: no-repeat;
height: 0;
padding: 16px 15px 0 0 !important;
width: 0;
}

.ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] {
background-image: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/miniicons/Blue-Flower-16x16.png);
padding: 16px 15px 0 0 !important;
}

.ljuser img[src="http://p-stat.livejournal.com/img/openid-profile.gif"] {
background-image: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/miniicons/Blue-Flower-16x16.png);
padding: 16px 15px 0 0 !important;
}

.entryText img[src="http://p-stat.livejournal.com/img/poll/mainbar.gif"] {
background: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/stark/mainbargreen.gif);
height: 0;
padding: 7px 0;
}

.entryText img[src="http://p-stat.livejournal.com/img/poll/leftbar.gif"] {
background: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/stark/leftbargreen.gif);
height: 0;
padding: 14px 0 0 7px;
}

.entryText img[src="http://p-stat.livejournal.com/img/poll/rightbar.gif"] {
background: url(http://i50.photobucket.com/albums/f333/light_writing/Livejournal/stark/rightbargreen.gif);
height: 0;
padding: 7px 0px 7px 0;
}

CSS, Images and Directions for this layout can also be found in my layout journal losing_light. Feel free to friend it if you like this layout or others that you see there.