Smooth Sailing; Id Engager

Feb 07, 2010 19:28



LIVE | STATIC | FAQ


Layout Information
TESTED BROWSERS Mozilla Firefox, Safari, Internet Explorer
PROBLEMS? None ;D
FEATURES Liquid width, tiny icons, contextual pop ups, custom nav-strip
DISABLED Journal subtitle, header-menu (put links in the sidebar!) entry date
AD-PLACEMENT Between Entries
FINAL NOTES Another request for the f-list, this time for surrea1ist. I'd write more, but right now I'm *slightly* preoccupied. Enjoy guys!


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).

03. Make sure that you set the sidebar to the right.
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: Id Engager
MAKER: kill_zombie
FOR: surrea1ist

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

*/

body { background-color: #FAEFC2; font-family: Verdana, Sans serif; font-size: 10px; color: #333333; text-align: left; margin: 0px; padding: 0px; }
a, a:visited { color: #F05D77; text-decoration: none; }
a:hover { color: #A4AC9D; }

.pageblock { width: 95%; margin: 10px auto 0px auto; padding: 0px; }
.pagefooterblock, .header-menu, .header-subtitle, .header-icon, .bodyheaderblock, .entryHeaderDate, .profile-label { display: none; }
.pageheaderblock { text-align: left; }
.header-menu { position: absolute; width: 250px; font-family: Georgia; font-style: italic; color: #FFFFFF; letter-spacing: -1px; text-transform: lowercase; margin: 0px 0px 0px 100px; }
.header-menu a { border-left: 10px solid #A4626C; font-size: 17px; color: #FFFFFF; padding: 6px 10px 6px 20px; }
.header-menu a:hover { border-left: 10px solid #A27879; }
.header-menu ul { margin: 0px; padding: 0px; }
.header-menu li { list-style-type: none; margin: 0px 0px 8px 0px; display: block; }
.header-title { position: relative; top: 63px; font-family: Georgia; font-size: 42px; color: #A4626C; text-transform: lowercase; letter-spacing: -3px; padding: 0px 0px 0px 60px; }

.bodyblock { width: 100%; margin: 40px 0px 0px 0px; padding: 10px 20px 30px 0px; }
.entryHolder, .sidebox { font-family: Helvetica; }
.entryHolder, .sidebox, .bodynavblock { background-color: #FFFFFF; border-top: 8px solid #A4626C; margin: 10px 0px 10px 0px; padding: 10px; }
.entryHeader { font-size: 0px; line-height: 19px; text-align: left; border-bottom: 1px solid #EBEBEB; padding: 10px 15px 1px 5px; }
.entryHeader a, .entryHeader a:hover { position: relative; font-family: Georgia; font-size: 18px; font-weight: normal; font-style: italic; color: #A4AC9D; letter-spacing: -1px; text-transform: lowercase; z-index: 10; }
.entryHeaderSubject { position: relative; padding: 0px 0px 0px 10px; z-index: 30; }
.entryUserinfo { text-align: right; margin: -30px 10px 0px 0px; }
.entryUserinfo-usericon img, .commentUserinfo-usericon img { height: 70px; width: 70px; margin: 0px 0px 3px 0px; }
.entryUserinfo-usericon img, img.profile-userpic, .commentUserinfo-usericon img { background-color: #F7F7F7; border: 1px solid #EBEBEB; padding: 6px; }
.entryUserinfo-usericon img:hover, img.profile-userpic:hover, .commentUserinfo-usericon img:hover { background-color: #FFFFFF; }
.entryText, .sideboxContent { font-size: 12px; color: #444444; text-align: left; padding: 10px; }
.entryMetadata { font-size: 11px; padding: 5px 15px 10px 10px; }
.entryMetadata, .entryLinkbar, .commentLinkbar { border-top: 1px solid #EBEBEB; }
.entryMetadata a { text-transform: lowercase; }
.entryMetadata a:hover { border-bottom: 1px dotted #888888; }
.entryMetadata ul { margin: 0px; padding: 0px; }
.entryMetadata li { list-style: none; padding: 0px 10px 0px 0px; display: block; }
.entryMetadata-label { font-weight: bold; text-transform: uppercase; padding: 0px 6px 0px 0px; }
.entryLinkbar { font-size: 12px; text-transform: uppercase; text-align: right; padding: 5px 10px 0px 15px; }
.entryLinkbar ul, .commentLinkbar ul { margin: 0px; padding: 0px; }
.entryLinkbar li, .commentLinkbar li { margin: 0px; padding: 0px 15px 0px 0px; display: inline; }

.sidebar { width: 290px; font-family: Helvetica; color: #444444; margin: 0px 0px 0px 20px; }
.sideboxTitle { font-family: Georgia; font-size: 18px; font-weight: normal; font-style: italic; color: #A4AC9D; letter-spacing: -1px; text-transform: lowercase; text-align: left; border-bottom: 1px solid #EBEBEB; padding: 10px 15px 7px 5px; }
.sidebox #profile, .sidebox #search { text-align: left; }
.sidebox #profile { min-height: 130px; font-size: 11px; }
.sidebox #profile .ljuser a b { font-size: 16px; letter-spacing: -1px; }
.sidebox #profile img[src*="userinfo.gif"], .sidebox #profile img[src*="community.gif"], .entryUserinfo .ljuser img { display: none; }
img.profile-userpic { float: left; margin: 0px 10px 7px 0px; }
.profile-content { font-size: 12px; text-transform: uppercase; margin: 5px 0px 0px 115px; display: block; }
.sidebox #systemlinks, .sidebox #tags_sidebox { font-size: 0px; text-align: right; }
.listtitle { font-family: Georgia; font-size: 16px; font-weight: normal; font-style: italic; color: #A4AC9D; letter-spacing: -1px; text-transform: lowercase; text-align: left; padding: 5px 15px 2px 15px; }
.listitem, .sidebox #tags_sidebox a { border-bottom: 1px solid #AAAAAA; padding: 6px 10px 2px 10px; display: block; }
.listitem a, .sidebox #tags_sidebox a { font-size: 11px; color: #444444; text-transform: uppercase; }
.listitem:hover, .sidebox #tags_sidebox a:hover { color: #444444; border-bottom: 1px solid: #A4626C; }
.sidebox #summary { font-family: Tahoma; font-size: 11px; color: #444444; text-align: left; line-height: 1.4em; }
.sidebox #summary a { font-weight: normal; color: #444444; text-transform: uppercase;padding: 0px; }
.sidebox #summary a:hover { color: #666666; border-bottom: 1px dotted #444444; }
.sidebox #summary img[src="http://l-stat.livejournal.com/img/icon_protected.gif"], .sidebox #summary img[src="http://l-stat.livejournal.com/img/icon_groups.gif"], .sidebox #summary img[src="http://l-stat.livejournal.com/img/icon_private.gif"], .sidebox #summary .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"], .sidebox #summary .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] { display: none; }
.sidebox #latestmonth table { width: 95%; text-align: center; text-transform: uppercase; margin: 4px auto 0px auto; }
.latestmonth-inactive, .latestmonth-active { background-color: #FFFFFFF; border: 1px solid #EBEBEB; margin: 1px; padding: 1px 1px 10px 10px; }
.latestmonth-inactive:hover, .latestmonth-active:hover { background-color: #F7F7F7; }
.sidebox #search { font-size: 13px; color: #444444; text-align: center; }
.sidebox #search input, .sidebox #search select { background-color: #F7F7F7; font-family: Georgia; font-size: 11px; color: #666666; line-height: 13px; border: 1px solid #EBEBEB; margin: 1px; padding: 2px; }

.bodynavblock { font-family: Helvetica; font-size: 12px; color: #444444; text-align: center; }
.bodynavblock a, #footer-menu a { font-family: Georgia; font-style: italic; color: #A4AC9D; text-transform: lowercase; letter-spacing: -4px; margin: 0px 7px 0px 7px; }
.bodynavblock a:hover, #footer-menu a:hover { color: #A4AC9D; }
#footer-menu { font-size: 47px; }
#footer-menu ul { margin: 0px; padding: 0px; }
#footer-menu li { list-style-type: none; display: inline; }

.commentHolder { background-color: #FFFFFF; font-family: Helvetica; margin: 10px 0px 0px 0px; padding: 10px 20px 5px 20px; }
.commentHeader, .commentHeaderScreened { font-family: Georgia; font-size: 14px; border-bottom: 1px solid #EBEBEB; padding: 5px 10px 5px 20px; }
.commentHeader { font-style: italic; color: #A4AC9D; }
.commentHeaderScreened { color: #555555; }
.commentUserinfo { font-size: 0px; color: #FFFFFF; text-align: center; margin: 5px 0px 5px 5px; }
.commentUserinfo .ljuser a b { font-family: Georgia; font-weight: normal; font-style: italic; font-size: 13px; letter-spacing: -1px; }
.commentUserinfo .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"], .commentUserinfo .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] { display: none; }
.commentText { font-size: 12px; color: #444444; text-align: justify; padding: 10px 20px 20px 10px; }
.commentLinkbar { font-size: 10px; text-transform: uppercase; text-align: right; padding: 3px 10px 0px 10px; }
.commentLinkbar li { margin: 0px; padding: 0px 8px 0px 0px; display: inline; }
.replyform { background-color: #FFFFFF; padding: 17px; }
#qrform { color:#FFFFFF; border: medium none !important; padding:16px; }
#qrform table { width: 98%; color: #AAAAAA; border:0 none !important; }

.yearlinks { text-align: right; }
.yearlink { padding: 0px 5px 0px 5px; }
.month { width: 90%; margin: 20px 10px 10px 10px; }
.daytitles { font-size: 13px; color: #555555; text-align: center; text-transform: uppercase; border: 1px solid #F3F3F3; padding: 12px 10px 2px 10px; }
.daysubjects { font-family: Helvetica; font-size: 12px; color: #444444; text-align: left; padding: 10px 0px 0px 40px; }
.daysubjects a { font-size: 11px; text-transform: lowercase; }
.daysubjects img[src="http://l-stat.livejournal.com/img/icon_protected.gif"], .daysubjects img[src="http://l-stat.livejournal.com/img/icon_groups.gif"], .daysubjects img[src="http://l-stat.livejournal.com/img/icon_private.gif"]{ width: 0; height: 0; padding: 0 12px 12px 0; margin: 0px 5px 0px 0px; background: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/locked-2.gif); filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1; !important }
.daysubjects img { width: 0; height: 0; background-repeat: no-repeat; /* so that IE users will still see an image */ margin: 0px 5px 0px 0px; background-image: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/locked-2.gif); padding: 12px 12px 0 0; filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1; !important }
.day-blank, .day { border: 1px solid #dddddd; margin-bottom: 0px; padding: 3px; }
.day-date { width: 50%; color: #000000; text-align: center; border-right: 1px solid #dddddd; border-bottom: 1px solid #dddddd; }
.day-count { float: right; width: 50%; font-size: 20px; text-align: center; }
.day-count a { font-size: 21px; padding: 3px; }

.tagstable { width: 500px; }
.tagstable, .tagstable td { border: none; }
ul.taglist { padding-right: 11px; }
ul.taglist li { color: #999999; list-style-position: outside; list-style-type: decimal-leading-zero; padding: 0px 3px 3px 9px; }
.tagstable a:hover, ul.taglist a:hover { color: #333333; border-bottom: 1px dotted #999999; }
li { color: #555555; list-style-type: decimal-leading-zero; margin: 2px 0px 0px 0px; padding: 0px 0px 2px 9px; }

blockquote { font-family: Georgia; font-size: 12px; color: #555555; border-left: 10px solid #A4626C; padding: 0px 10px 0px 15px; }
select, input { background-color: #F7F7F7; font-family: Georgia; font-size: 11px; color: #666666; border: 1px solid #EBEBEB; margin: 1px; padding: 2px; }
textarea { height: 90px; width: 400px; background-color: #F7F7F7; font-family: Georgia; font-size: 11px; color: #666666; line-height: 13px; border: 1px solid #EBEBEB; margin: 1px; padding: 2px; }

.entryHeader img[src="http://l-stat.livejournal.com/img/icon_protected.gif"]{ width: 0; height: 0; padding: 0 16px 16px 0; margin: 0px 5px 0px 0px; background: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/icon_padlock.gif); }
.entryHeader img[src="http://l-stat.livejournal.com/img/icon_groups.gif"]{ width: 0; height: 0; padding: 0 16px 16px 0; margin: 0px 5px 0px 0px; background: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/icon_favourites.gif); }
.entryHeader img[src="http://l-stat.livejournal.com/img/icon_private.gif"]{ width: 0; height: 0; padding: 0 16px 16px 0; margin: 0px 5px 0px 0px; background: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/icon_key.gif); }
.entryHeader img { width: 0; height: 0; background-repeat: no-repeat; /* so that IE users will still see an image */ margin: 0px 5px 0px 0px; background-image: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/018.png); padding: 16px 48px 0 0; }
.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://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/13-1.png); padding: 16px 16px 0 1px !important; }
.ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] { background-color:transparent; background-image: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/13-1.png); padding: 16px 16px 0 1px !important; }
.ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] { background-color:transparent; background-image: url(http://i274.photobucket.com/albums/jj270/jessica0293/tiny%20icons/66-1.png); padding: 16px 16px 0 1px !important; }
.ljuser a b { font-weight: bold; color: #A4626C; text-transform: lowercase; }
.ljuser a b:hover { color: #F05D77; border-bottom: 1px dotted #888888; }

div.ContextualPopup div.Inner { width: 260px; background: #F7F7F7 !important; font: 10px Arial; color: #555555 !important; border: 1px solid #A4AC9D; }
div.ContextualPopup div.Userpic img { background-color: #F7F7F7; border: 0px; padding: 0px 2px 0px 0px; margin: 10px; }
div.ContextualPopup div.Userpic img:hover { filter: alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8; !important }
div.ContextualPopup .Relation { font-family: Georgia; font-style: italic !important; font-weight: bold !important; font-size: 14px !important; color: #F05D77 !important; text-transform: lowercase; border-bottom: 1px solid #A4AC9D; margin-bottom: 3px; padding-bottom: 5px; }
div.ContextualPopup div.Inner div.Content a { font-weight: normal; color: #444444 !important; text-decoration: none !important; text-transform: uppercase; }
div.ContextualPopup div.Inner div.Content a:hover { color: #F05D77 !important; }
div.ContextualPopup div.Inner div.Content img a:hover { background: none !important; }
div.Relation, div.FriendStatus { font-size: 11px; text-transform: uppercase; letter-spacing: -1px; border-bottom: 1px solid #EDEDED; padding: 2px 2px 5px 2px; margin: 0px 0px 8px 0px; }

#lj_controlstrip { border-bottom: 0px; }
#lj_controlstrip td { background: #212121; color: #FFFFFF; text-transform: uppercase; border-right: 0px; }
#lj_controlstrip select, #lj_controlstrip input { background-color: #282828 !important; font: 9px Arial !important; color: #FFFFFF !important; text-transform: uppercase; border: 1px solid #3D3D3D; margin: 1px; padding: 1px; }
#lj_controlstrip select:hover, #lj_controlstrip input:hover, .sidebox #search input:hover, .sidebox #search select:hover, textarea:hover, input:hover, select:hover { border: 1px solid #F05D77; }
#lj_controlstrip td a { color: #FFFFFF; }
#lj_controlstrip td a:hover {color: #F05D77; text-decoration: none; }
#lj_controlstrip .ljuser img { display: none; }
#lj_controlstrip .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"], #lj_controlstrip .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] { display: none; }
#lj_controlstrip .ljuser a b { font-size: 16px; font-weight: bold; color: #F05D77; text-transform: lowercase; letter-spacing: -1px; }
#lj_controlstrip .ljuser a b:hover { border-bottom: 1px dotted #999999; }

DISPLAY > PRESENTATION Expand BASIC OPTIONS and ADDITIONAL OPTIONS

Userinfo Position in Entries → Right side of the Entry Text
Wrap Entry text under userinfo → No
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 - Community
Entry Header - Protected - Private - Groups

Original post → 032
Credit kill_brainz if you use please

style: smooth sailing, maker: kill_zombie

Previous post Next post
Up