047 - The Loneliest Guy [Smooth Sailing]

[kill_zombie]

The Loneliest Guy ► LIVE | STATIC | FAQ


Layout Information
TESTED BROWSERS Mozilla Firefox, Internet Explorer
PROBLEMS? Looks utterly fucked in IE
FEATURES Topbar, tiny icons, contextual pop ups, custom nav-strip
DISABLED Footer menu, header-title/subtitle
AD-PLACEMENT Between Entries
FINAL NOTES Request for physician. I adore this girl's taste in colours, which made this layout pretty easy to do since all the colours were pretty and balanced and worked so well together. Probably my new favourite design~


Layout Installation
SELECT JOURNAL STYLE 01. Select any Smooth Sailing.

02. Pick an ad placement you prefer (Between Entries tends to look best in general).
CUSTOM CSS Use layout's stylesheet(s) → NO
Use layout's stylesheet(s) when including custom external stylesheet → NO

Use CTRL + A inside the textbox to select everything, and then copy and paste into the CUSTOM CSS box.

/*

LJ STYLE: Smooth Sailing
LAYOUT: The Loneliest Guy
MAKER: jessilestrange // kill_zombie
FOR: physician

PLEASE CREDIT:
http://community.livejournal.com/kill_brainz/
OR
http://jessilestrange.livejournal.com/

*/

body { background: #A8A89F; font-family: Verdana, Lucida Sans Unicode, Arial; font-size: 10px; color: #555555; text-align: center; margin: 0px; padding: 0px; }
a, a:visited { color: #926F6B; text-decoration: none; }
a:hover { color: #372B2D; cursor: help; }

.pageblock { width: 820px; margin: 80px auto 40px auto; padding: 0px; }
.pagefooterblock, .bodyheaderblock, #footer-menu, .header-title, .header-subtitle, .header-icon, .sidebar .ljuser img, .profile-label, .entryUserinfo .ljuser img, .entryUserinfo .ljuser a b, .entryLinkbar a[st_page="home"], .commentUserinfo .ljuser img, #lj_controlstrip .ljuser img { display: none; }
.pagheaderblock { margin: 0px auto; padding: 0px; }
.header-menu { background: #C8CFCB; font-family: Helvetica; font-weight: bold; font-size: 15px; text-transform: uppercase; text-align: right; border-bottom: 5px solid #A8A89F; padding: 18px 0px 10px 0px; }
.header-menu a { background: #C8CFCB; color: #919191; border-left: 5px solid #A8A89F; padding: 18px 10px 10px 10px; }
.header-menu a:hover { background: #B8C2BC; color: #555555; }
.header-menu ul, .header-menu li, .entryLinkbar ul, .entryLinkbar li { list-style-type: none; margin: 0px; padding: 0px; }
.header-menu li { display: inline; }

.bodyblock { padding: 0px; }
.sidebar { width: 220px; margin: 0px 5px 0px 0px; }
.sidebox, .entryHolder { margin: 0px 0px 5px 0px; padding: 0px; }
.sideboxContent { background: #FFFFFF; font-size: 11px; text-align: left; padding: 10px; }
.sideboxTitle { text-align: left; border-bottom: 5px solid #A8A89F; }
.sideboxTitle, .listtitle { background: #C8CFCB; font-family: Helvetica; font-weight: bold; font-size: 18px; color: #372B2D; text-transform: uppercase; line-height: 16px; padding: 18px 10px 10px 10px; }
.sidebox #profile { min-height: 65px; font-size: 9px; }
.sidebox #profile .ljuser a b, .sidebox #summary .ljuser a b { font-family: Helvetica; font-size: 10px; }
.profile-content { font-size: 11px; text-transform: uppercase; }
img.profile-userpic { float: left; background: #B8C2BC; height: 55px; width: 55px; border-right: 5px solid #A8A89F; border-bottom: 5px solid #A8A89F; margin: -10px 10px 5px -10px; padding: 15px; }
.sidebox #systemlinks, .sidebox #tags_sidebox { font-size: 0px; text-align: left; }
.sidebox #systemlinks { margin: 0px 0px -5px 0px; padding: 0px; }
.listtitle { text-align: right; }
.listtitle, .listitem { border-bottom: 5px solid #A8A89F; }
.listitem { background: #C8CFCB; padding: 10px 10px 5px 10px; }
.listitem:hover { background: #B8C2BC; }
.listitem a { font-family: Helvetica; font-weight: bold; font-size: 15px; color: #919191; text-transform: uppercase; }
.listitem a:hover, .entryLinkbar a:hover { color: #555555; }
.listitem:hover, .entryLinkbar a:hover { background: #B8C2BC; }
.sidebox #tags_sidebox a { font-size: 11px; line-height: 11px; margin: 3px 0px 0px 0px; display: block; }
.sidebox #summary img[src*="icon_protected.gif"], .sidebox #summary img[src*="icon_groups.gif"], .sidebox #summary img[src*="icon_private.gif"], .daysubjects img[src*="icon_protected.gif"], .daysubjects img[src*="icon_groups.gif"], .daysubjects img[src*="icon_private.gif"] { height: 0px; width: 0px; background: no-repeat center left; margin: 0px !important; padding: 10px 10px 0px 0px !important; }
.sidebox #summary img[src*="icon_protected.gif"], .sidebox #summary img[src*="icon_groups.gif"], .daysubjects img[src*="icon_protected.gif"], .daysubjects img[src*="icon_groups.gif"] { background: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/181.png) transparent !important; }
.sidebox #summary img[src*="icon_private.gif"], .daysubjects img[src*="icon_private.gif"] { background: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/183.png) transparent !important; }
.sidebox #latestmonth { font-family: Helvetica; font-weight: bold; font-size: 10px; text-transform: uppercase; }
.sidebox #latestmonth table { width: 95%; margin: 0px auto 0px auto; }
.latestmonth-inactive, .latestmonth-active { color: #919191; text-align: center; margin: 1px; padding: 6px; }
.latestmonth-inactive, .day-date { background: #C8CFCB; }
.latestmonth-active, .day-date:hover { background: #B8C2BC; }
.latestmonth-active a, .day-date:hover { color: #FFFFFF; }
.sidebox #search { font-family: Helvetica; font-size: 10px; text-transform: uppercase; text-align: center; }
.sidebox #search input, .sidebox #search select { background: #C8CFCB; font-family: Verdana; font-weight: bold; font-size: 9px; color: #919191; border: 0px; margin: 1px; padding: 3px; }
.sidebox #search input:hover, .sidebox #search select:hover { background: #B8C2BC; }

.entryHolder { background: #C8CFCB; margin: 0px 0px 5px 0px; padding: 0px; }
.entryHeader { height: 75px; font-family: Helvetica; font-size: 0px; text-transform: uppercase; text-align: left; margin: 0px; padding: 10px 110px 0px 10px; }
.entryHeaderDate { font-weight: bold; font-size: 25px; color: #B8C2BC; letter-spacing: -2px; text-align: right; display: block; }
.entryHeader a { font-weight: bold; font-size: 18px; color: #372B2D; line-height: 16px; margin: -8px 0px; z-index: 40; }
.entryHeaderSubject { padding: 0px; z-index: 30; }
.entryUserinfo { text-align: center; }
.entryUserinfo-usericon img { position: relative; background: #B8C2BC; height: 55px; width: 55px; border: 0px; border-left: 5px solid #A8A89F; margin: -85px 0px 8px 0px; padding: 15px; z-index: 50; }
.entryText { font-size: 12px; color: #555555; border-top: 5px solid #A8A89F; padding: 17px; }
.entryText, .entryMetadata { background: #FFFFFF; text-align: left; margin: 0px; }
.entryText img { max-width: 550px; background: #F3F3F3; margin: 2px; padding: 4px; }
.entryText li { color: #444444; }
.ljcut-link a { font-weight: bold; text-transform: uppercase; }
.entryMetadata { font-size: 9px; color: #888888; text-transform: uppercase; padding: 10px 17px 17px 17px; }
.entryMetadata-label { margin: 0px 3px 0px 0px; }
.entryMetadata ul { margin: 0px; padding: 0px; }
.entryMetadata li { list-style-type: none; margin: 0px; padding: 0px; display: block; }
.entryMetadata img { margin: 1px; }
.entryLinkbar { font-family: Helvetica; font-weight: bold; font-size: 15px; border-top: 5px solid #A8A89F; padding: 0px; }
.entryLinkbar a { float: left; width: 25%; background: #C8CFCB; color: #919191; text-transform: uppercase; list-style-type: none; margin: 0px; padding: 6px 0px 6px 0px; display: block; }

.commentHolder { background: #FFFFFF; border-bottom: 5px solid #A8A89F; margin: 0px; padding: 0px; }
.commentHeader, .commentHeaderScreened { height: 25px; background: #C8CFCB; font-family: Helvetica; font-weight: bold; font-size: 10px; text-align: right; border-bottom: 5px solid #A8A89F; margin: 0px; padding: 20px 20px 0px 110px; }
.commentHeaderScreened { font-style: italic; }
.commentHeaderSubject { text-transform: uppercase; }
.commentUserinfo { position: relative; width: 100px; background: #B8C2BC; font-size: 9px; color: #555555; text-align: center; border-right: 5px solid #A8A89F; border-bottom: 5px solid #A8A89F; margin: -50px 10px 5px 0px; padding: 20px 0px 13px 0px; z-index: 50; }
.commentUserinfo-usericon img { height: 75px; width: 75px; border: 0px; margin: 0px 20px 7px 20px; }
.commentUserinfo .ljuser a b { font-family: Helvetica; font-weight: bold; color: #FFFFFF; text-transform: uppercase; }
.commentText { font-size: 11px; text-align: left; padding: 17px; }
.commentLinkbar { font-size: 9px; color: #333333; text-transform: lowercase; line-height: 10px; text-align: right; border-top: 1px solid #EDEDED; margin: 0px 5px 0px 5px; padding: 3px 0px 2px 0px; }
.commentLinkbar li { list-style-type: none; margin: 0px 12px 0px 0px; padding: 0px; display: inline; }
.replyform { background: #FFFFFF; font-family: Verdana; font-size: 10px; color: #555555; padding: 10px; }
#commenttext { width: 100%; }

.yearlinks { text-align: right; }
.yearlink { padding: 0px 5px 0px 5px; }
.month { width: 100%; border-top: 5px solid #A8A89F; margin: -41px 0px 0px 0px; padding: 0px; }
.daytitles { font-family: Helvetica; font-weight: bold; font-size: 10px; text-transform: uppercase; text-align: center; padding: 16px 0px 10px 0px; }
.daytitles, .day-blank, .day, .tagstable, .tagstable td { background: #FFFFFF; border: 3px solid #FFFFFF; }
.day-blank, .day, .tagstable td { padding: 10px; }
.daysubjects { background: #FFFFFF; font-size: 9px; text-align: left; border-top: 5px solid #A8A89F; margin: -41px 0px 0px 0px; padding: 10px 0px 10px 30px; }
.daysubjects a { font-family: Helvetica; font-weight: bold; font-size: 10px; text-transform: uppercase; }
.daysubjects img { width: 0px; height: 0px; background-repeat: no-repeat; margin: 0px 2px 0px 0px; background: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/065.png); padding: 10px 10px 0px 0px; }
.day-date { font-weight: bold; font-size: 10px; color: #919191; text-align: left; border: 0px; margin: 0px 0px 4px 0px; padding: 4px 6px 2px 6px; }
.day-count { float: right; width: 30%; line-height: 19px; text-align: center; }
.day-count a { font-family: Helvetica; font-size: 18px; }

.tagstable { width: 550px; margin: 20px auto; }
.tagstable td { font-size: 11px; text-transform: uppercase; }
.tagstable a, ul.taglist a { font-family: Helvetica; font-weight: bold; font-size: 10px; text-transform: uppercase; }
ul.taglist { padding: 0px 15px 0px 0px; }
ul.taglist li { font-size: 9px; padding: 0px 3px 3px 9px; }

blockquote { background: #C8CFCB; font-family: Helvetica; font-weight: bold; font-size: 14px; color: #919191; line-height: 14px; text-align: justify; padding: 15px; }
blockquote a, blockquote .ljuser a b { color: #969696; }
input, textarea, select { background-color: #F8F8F8; font-family: Verdana; font-size: 10px; border: 1px solid #DDDDDD; margin: 1px; padding: 2px; }
textarea { height: 90px; width: 400px; color: #666666; text-align: left; }
b, strong, i, em, strike { color: #A8A89F; }
li { list-style-position: outside; list-style-type: decimal-leading-zero; margin: 2px 0px 0px 20px; padding: 0px 0px 2px 9px; }
h1, h2, h3, h4, h5 { font-family: Helvetica; font-weight: bold; color: #372B2D; text-transform: uppercase; }

.ljuser a b { color: #926F6B; }
.ljuser a b:hover { color: #372B2D; }
.ljuser img { width: 0px; height: 0px; background: transparent url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/041.png) no-repeat bottom left; padding: 10px 10px 0px 0px !important; }
img[src*="userinfo.gif"], img[src*="user_ontd.gif"], img[src="http://www.livejournal.com/stc/img/userinfo-support.gif"], img[src*="community.gif"], img[src*="partnercomm.gif"], img[src*="sponcomm.gif"], img[src*="icon_protected.gif"], img[src*="icon_groups.gif"], img[src*="icon_private.gif"], img[src*="syndicated.gif"], img[src*="newsinfo.gif"], div.ContextualPopup img[src="http://l-stat.livejournal.com/horizon/upgrade-paid-icon.gif"] { width: 0px; height: 0px; padding: 10px 10px 0px 0px !important; }
img[src*="userinfo.gif"], img[src*="user_ontd.gif"], img[src="http://www.livejournal.com/stc/img/userinfo-support.gif"] { background: transparent url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/031-1.png) no-repeat center left !important; }
img[src*="community.gif"], img[src*="partnercomm.gif"], img[src*="sponcomm.gif"] { background: transparent url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/045-1.png) no-repeat center left !important; }
img[src*="syndicated.gif"] { background: transparent url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/001.png) no-repeat center left !important; }
img[src*="newsinfo.gif"] { background: transparent url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/078.png) no-repeat center left !important; }
img[src*="icon_protected.gif"], img[src*="icon_groups.gif"], img[src*="icon_private.gif"] { background: no-repeat center left !important; margin: 0px 5px 0px 0px; padding: 16px 16px 0px 0px !important; }
img[src*="icon_protected.gif"] { background: transparent url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/018.png) !important; }
img[src*="icon_groups.gif"] { background: transparent url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/019.png) !important; }
img[src*="icon_private.gif"] { background: transparent url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/025.png) !important; }
img[src*="anonymous.gif"], img[src*="openid-profile.gif"], .replyform img[src*="userinfo.gif"], img[src*="none.gif"], img[src*="help.gif"], img[src*="pencil.gif"], img[src*="btn_edit.gif"] { height: 0px; width: 0px; background: no-repeat scroll 50% 50%; padding: 0px 0px 14px 15px !important; }
img[src*="anonymous.gif"] { background: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/earth.png); }
img[src*="openid-profile.gif"] { background: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/talking.png); }
.replyform img[src*="userinfo.gif"] { background: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/user-9.png) !important; }
img[src*="none.gif"] { background: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/happyface.png); }
img[src*="help.gif"] { background: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/exclamation.png); }
img[src*="pencil.gif"] { background: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/pencil-1.png); }
img[src*="btn_edit.gif"] { background: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/clipboard_full.png); }
div.ContextualPopup img[src="http://l-stat.livejournal.com/horizon/upgrade-paid-icon.gif"] { background: transparent url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/arrow_up-3.gif) no-repeat center left; vertical-align: baseline !important; }

div.ContextualPopup div.Inner { width: 270px; background: none !important; font: 10px Verdana; color: #666666 !important; border: 0px; }
div.ContextualPopup div.Userpic img { background: #B8C2BC; margin: 0px !important; padding: 10px; }
div.ContextualPopup div.Userpic img, div.ContextualPopup div.Inner div.Content { border: 1px solid #C8CFCB; }
div.ContextualPopup .Relation { margin-bottom: 5px; padding-bottom: 3px; }
div.Relation, div.FriendStatus { font-family: Arial; font-size: 11px !important; color: #444444 !important; line-height: 10px; text-transform: uppercase; border-bottom: 0px; padding: 2px 2px 5px 2px; margin: 0px 0px 8px 0px; }
div.ContextualPopup div.Inner div.Content { background: #C8CFCB; margin: 0px 85px 0px 0px; padding: 6px; }
div.ContextualPopup div.Inner div.Content a { font-weight: lighter; color: #444444 !important; text-decoration: none !important; }
div.ContextualPopup div.Inner div.Content a:hover { color: #A8A89F !important; }

#lj_controlstrip { border-bottom: 0px; z-index: 300; }
#lj_controlstrip_statustext { font-family: Verdana; font-weight: bold; font-size: 11px; color: #926F6B; text-transform: uppercase; }
#lj_controlstrip td { background: #372B2D !important; font-size: 10px; font-weight: bold; color: #FFFFFF; border-right: 0px; }
#lj_controlstrip select, #lj_controlstrip input { background: #926F6B !important; font: 10px Helvetica !important; color: #372B2D !important; border: 1px solid #372B2D; padding: 1px; }
#lj_controlstrip td a { font-weight: bold; color: #926F6B; text-decoration: none; }
#lj_controlstrip td a:hover { color: #A8A89F; text-decoration: none; }
#lj_controlstrip .ljuser a b, #lj_controlstrip .ljuser a b:hover { font-family: Helvetica; font-weight: bold; font-size: 13px; color: #926F6B; text-transform: lowercase; }
DISPLAY > PRESENTATION Expand BASIC OPTIONS and ADDITIONAL OPTIONS

Userinfo Position in Entries → Right side of the Entry Text
Wrap Entry text under userinfo → Yes
IMAGES Save these to your own servers to ensure that the images don't die on you when my Photobucket explodes :D

Tiny Icons → User/Support User/User ONTD - Commmunity - News - Syndicated
Entry Header → Protected - Private - Groups
Comment Pages → Anonymous - Open ID - User - None - Help - Pencil - Edit

An easy way to replace all of the old URLs listed below with the new is to use CTRL + H when editing in a program like Notepad.