Stay; Smooth Sailing

[lu_hesperia]

( STATIC ) ( LIVE )

XV. STAY→ S2 Smooth Sailing
→ Basic, plus and paid; ad placement between entries or horizontal.
→ Features custom comment pages, title, navigation and topbar.
→ Only the first three sideboxes will be visible.
PREVIEW AND CODE
(Static) (Live)
/*- 015 Stay
Layout by lu_hesperia at ourhappyhours.livejournal.com
Tiny icons by pinvoke.com -*/

@font-face {font-family: 'Droid Serif'; font-style: normal; font-weight: 400; src: local('Droid Serif'), local('DroidSerif'), url(http://fonts.gstatic.com/s/droidserif/v6/0AKsP294HTD-nvJgucYTaI4P5ICox8Kq3LLUNMylGO4.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;}

@font-face {font-family: 'Droid Serif'; font-style: normal; font-weight: 700; src: local('Droid Serif Bold'), local('DroidSerif-Bold'), url(http://fonts.gstatic.com/s/droidserif/v6/QQt14e8dY39u-eYBZmppwYlIZu-HDpmDIZMigmsroc4.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;}

@font-face {font-family: 'Droid Serif'; font-style: italic; font-weight: 400; src: local('Droid Serif Italic'), local('DroidSerif-Italic'), url(http://fonts.gstatic.com/s/droidserif/v6/cj2hUnSRBhwmSPr9kS5898u2Q0OS-KeTAWjgkS85mDg.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;}

@font-face {font-family: 'Playfair Display'; font-style: normal; font-weight: 400; src: local('Playfair Display'), local('PlayfairDisplay-Regular'), url(http://fonts.gstatic.com/s/playfairdisplay/v10/2NBgzUtEeyB-Xtpr9bm1Cdhy5e3cTyNKTHXrP9DO-Rc.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;}

@font-face {font-family: 'Playfair Display'; font-style: italic; font-weight: 400; src: local('Playfair Display Italic'), local('PlayfairDisplay-Italic'), url(http://fonts.gstatic.com/s/playfairdisplay/v10/9MkijrV-dEJ0-_NWV7E6N3L1iaS4euO_B3wJG_mMktU.woff2) format('woff2'); unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;}

::selection {background-color:#d6d6d6; color:#fff;}

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

body {background:#f8f8f8 url() repeat scroll 0 0; color:#919191; font-family: 'Droid Serif', Georgia, serif; font-size:12px; margin:0;}

a, a:link, a:visited {color:#e6beed; text-decoration:none; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s;}

a:hover {color:#c88fc4; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s;}

blockquote {padding: 8px; border: 1px dotted #e6e6e6; font-style: italic;}

textarea, input, select {background-color: #fff; color: #aaa; font-family: Consolas; font-size: 12px; border: 1px solid #e6e6e6;}

tt, code, kbd, samp {font-family: Consolas;}

.pageblock {}

.pageheaderblock {width: 730px; margin:55px auto;}

.header-title {font-family: 'Playfair Display', Georgia, serif; font-size: 36px; color: #fff; letter-spacing:1px; text-shadow: 1px 1px #d6d6d6; width: 395px; float: left; line-height: 0.95;}

.header-title::first-letter {padding: 3px 6px; font-size:40px; margin-right: 1px; background: url(http://i.imgur.com/AcVaJ1G.png) repeat scroll 0 0; border: 1px solid #e6e6e6; font-style: italic; text-transform: uppercase;}

.header-subtitle {display:none;}

.header-menu {width: 325px; text-align:right; float: right;}

.header-menu ul {}

.header-menu li {display: inline-block; padding: 4px 8px; background-color: #fff; margin:2px; border: 1px solid #e6e6e6;}

.header-menu li a {color:#999;}

.pagefooterblock {display:none;}

.bodyheaderblock {display:none;}

.bodyblock {margin: 0 auto; padding-top:265px; width: 730px;}

.entryHolder {background: url(http://i.imgur.com/AcVaJ1G.png) repeat scroll 0 0; margin:45px auto; border:1px solid #e6e6e6; padding:8px;}

.entryUserinfo {margin-right:-1px; margin-top: -1px;}

.entryUserinfo-username {font-family: 'Playfair Display', Georgia, serif; font-size: 11px; color: #999; text-align:center;}

.entryUserinfo-username .ljuser a, .entryUserinfo-username .ljuser a:hover {color:#999;}

.entryUserinfo-username .ljuser b {font-weight:normal;}

.entryUserinfo-usericon {border:1px solid #e6e6e6;}

.print-username {display:none;}

.entryUserinfo-usericon img {width:100px; height:100px; padding:1px; border:8px solid #fff; background-color:#e6e6e6;}

.entryText {background-color:#fff; border: 1px solid #e6e6e6; text-align:justify; padding:12px; line-height:1.3; margin-top: -1px; width: 566px;}

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

.entryHeader {font-family: 'Playfair Display', Georgia, serif; min-height: 17px; display: block; background: #fff; padding: 7px 10px; border: 1px solid #e6e6e6; font-size: 0px;}

.entryHeaderSubject {}

.entryHeaderSubject a, .entryHeaderSubject a:active, .entryHeaderSubject a:visited, .entryHeaderSubject a:hover {text-transform:uppercase; color:#999; font-size: 13px;}

.entryHeaderTags {display:none;}

.entryHeaderDate {float:right; font-size: 12px; color: #aaa; text-align: right;}

.entryMetadata-label {padding-right: 4px;}

.entryMetadata ul {margin: 0px; list-style: none; padding: 10px; background-color: #fff; border: 1px solid #e6e6e6; margin-top: -1px; line-height:1.3;}

.entryLinkbar {font-family: 'Playfair Display', Georgia, serif; text-transform:lowercase; text-align:right; padding-top:4px;}

.entryLinkbar a {color:#999;}

.entryLinkbar a:hover {color:#999;}

.entryLinkbar ul {margin:0;}

.entryLinkbar li {display:inline; margin:0; padding:0 1px 0 8px;}

.body-midtitle {display:none;}

.commentHolder {margin:20px 0; background: url(http://i.imgur.com/AcVaJ1G.png) repeat scroll 0 0; border:1px solid #e6e6e6; padding: 8px;}

.commentUserinfo {background-color:#fff; border:1px solid #e6e6e6; margin-right:-1px;}

.commentUserinfo-usericon img {width:100px; height:100px; padding:1px; border:8px solid #fff; border-bottom:0px; background-color:#e6e6e6;}

.commentUserinfo-username {font-family: 'Playfair Display', Georgia, serif; font-size: 10px; color: #999; padding: 2px 0px 5px; text-align:center;}

.commentUserinfo .ljuser a, .commentUserinfo .ljuser a:hover {color:#999;}

.commentUserinfo .ljuser b {font-weight:normal;}

.commentText {background-color:#fff; padding:12px; border:1px solid #e6e6e6; min-height: 107px; min-width: 210px; text-align:justify;}

.commentText img {max-width:100%}

.commentHeader {border:1px solid #e6e6e6; border-bottom:0px; padding: 7px 10px; color: #999; background-color:#fff; font-family: 'Playfair Display', Georgia, serif;}

.commentHeader a {}

.commentHeaderSubject {}

.commentHeaderScreened {}

.commentLinkbar {font-family: 'Playfair Display', Georgia, serif; text-transform:lowercase; text-align:right; padding-top:2px;}

.commentLinkbar ul {margin:0px; padding:0;}

.commentLinkbar li {display:inline; margin:0; padding:0 1px 0 8px;}

.commentLinkbar a {color:#999;}

.commentLinkbar a:hover {color:#999;}

textarea#body.textbox, textarea#commenttext.textbox {font-size: 13px;}

.replyform {padding-left: 30px;}

#qrform table {border: none !important;}

.month {width: 100%; padding: 0px 120px 20px; background-color: #fff; border: 1px solid #e6e6e6; border-top:0px;}

.entryHeader a {font-size:13px;}

.daytitles {padding-bottom: 10px; text-align:center;}

.month td {background-color:#fcfcfc; padding:2px; margin:2px; border: 1px solid #fff;}

.daysubjects {background-color: #fff; padding: 10px; border: 1px solid #e6e6e6; line-height:1.3;}

.day-date {text-align:right}

.day-blank {}

.day-count {font-size:16px; text-align:center;}

.sidebar {width:720px; height:159px; position:absolute; color:#999; background:transparent; top: 200px; background: url(http://i.imgur.com/AcVaJ1G.png) repeat scroll 0 0; border:1px solid #e6e6e6; padding: 0px 4px; overflow-y: hidden;}

.sidebox {background-color:#fff; margin:8px 4px; width:211px; float:left; border:1px solid #e6e6e6; border-right:0px; padding: 8px 10px; height:125px; overflow-y: scroll; line-height:1.3;}

.sideboxTitle {text-align:center; font-size:14px; padding-bottom:3px; font-family: 'Playfair Display', Georgia, serif;}

.sideboxContent {text-align:justify; border-top:1px solid #e6e6e6; padding-top:5px;}

.sidebox #profile {}

img.profile-userpic.ContextualPopup {width: 70px; float: left; padding-right: 8px;}

.sidebox #systemlinks {line-height:1.2;}

.sidebox #search {}

.sidebox #summary {}

.sidebox #latestmonth {}

.sidebox #latestmonth table {width:100%;}

.sidebox #latestmonth td {text-align:center;}

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

.sidebox #freetext, .sidebox #freetext2, .sidebox #freetext3, .sidebox #freetext4, .sidebox #freetext5, .sidebox #freetext6, .sidebox #freetext7, .sidebox #freetext8, .sidebox #freetext9 {text-align: justify; color:#aaa;}

.sidebox #freetext_private {display:none;}

.listitem {padding: 1px; border-bottom: 1px solid #e6e6e6; margin: 2px 0; }

.listspacer {height:10px;}

.listtitle {text-align:center; font-size: 13px; padding: 2px 0px 3px; font-family: 'Playfair Display', Georgia, serif; border-bottom: 1px solid #e6e6e6;}

#footer-menu {margin-bottom:60px; text-align: left; padding: 0;}

#footer-menu ul {margin:0 auto; padding:0;}

#footer-menu li {display: inline-block; padding: 4px 8px; background-color: #fff; margin:2px; border: 1px solid #e6e6e6;}

#footer-menu li a, #footer-menu li a:active, #footer-menu li a:visited {color:#999;}

#footer-menu li a:hover {color:#999;}

.bodynavblock {text-align: center; padding: 10px 0 40px;}

img[src*="icon_protected.gif"], img[src*="icon_private.gif"], img[src*="icon_groups.gif"], img[src*="icon_sticky.png"], .ljuser img[src*="syndicated.gif"], .ljuser img[src*="newsinfo.gif"], .ljuser img[src*="partnercomm.gif"], .ljuser img[src*="sponcomm.gif"] , img[src*="btn_del.gif"], img[src*="btn_edit.gif"], img[src*="btn_spam.gif"], img[src*="btn_scr.gif"], img[src*="btn_unscr.gif"], img[src*="btn_freeze.gif"], img[src*="btn_unfreeze.gif"], img[src*="btn_track.gif"], img[src*="btn_tracking.gif"], img[src*="btn_tracking_thread.gif"] , img[src*="anonymous.gif"], img[src*="openid-profile.gif"], img[src*="userinfo.gif"], img[src*="talk/none.gif"], img[src*="help.gif"], img[src*="pencil.gif"] {height: 0px; width: 0px; padding: 0 0 16px 16px !important; background: transparent none no-repeat scroll 0 0; }

.entryHeaderSubject img {vertical-align: bottom!important;}

img[src*="icon_protected.gif"]{background-image: url(http://i.imgur.com/1pkIxw8.png);}

img[src*="icon_private.gif"]{background-image: url(http://i.imgur.com/faoeIgT.png);}

img[src*="icon_groups.gif"]{background-image: url(http://i.imgur.com/i4V7S0x.png);}

img[src*="icon_sticky.png"]{background-image: url(http://i.imgur.com/FLp83.png);}

.ljuser img[src*="syndicated.gif"]{background-image: url(http://i.imgur.com/VW920.png) !important;}

.ljuser img[src*="newsinfo.gif"] {background-image: url(http://i.imgur.com/r6EzA.png) !important;}

.ljuser img[src*="partnercomm.gif"]{background-image: url(http://i.imgur.com/cJzp8.png) !important;}

.ljuser img[src*="sponcomm.gif"] {background-image: url(http://i.imgur.com/zupNZ.png) !important;}

img[src*="anonymous.gif"] {background-image: url(http://i.imgur.com/pOnEG.png);}

img[src*="openid-profile.gif"] {background-image: url(http://i.imgur.com/J4DG0.png);}

img[src*="userinfo.gif"] {background-image: url(http://i.imgur.com/NpNX0.png);}

img[src*="talk/none.gif"] {background-image: url(http://i.imgur.com/zKR7h.png);}

img[src*="help.gif"] {background-image: url(http://i.imgur.com/W4MKd.png);}

img[src*="pencil.gif"] {background-image: url(http://i.imgur.com/AQfq6.png);}

span.i-ljuser img[src*="img/userinfo.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(http://l-stat.livejournal.com/img/userinfo.gif?v=94.3) no-repeat !important; padding: 0 0 0 0 !important;}

span.i-ljuser img[src*="img/community.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(http://l-stat.livejournal.com/img/userinfo.gif?v=94.3) no-repeat !important; padding: 0 0 0 0 !important;}

span.ljuser a {text-decoration: none;}

span.ljuser a:hover {color;#fff!important;}

.w-cs {background: url(http://i.imgur.com/AcVaJ1G.png) repeat scroll 0 0!important; color:#999!important; min-height:50px; text-transform: lowercase; font: 11px 'Droid Serif', Georgia, serif!important; font-weight:normal!important; border-bottom:1px solid #e6e6e6;}

.w-cs a:link, .w-cs a:visited, .w-cs a:hover, .w-cs a:active {color:#999!important; font-family:'Droid Serif', Georgia, serif!important;}

.w-cs .ljuser a:link, .w-cs .ljuser a:visited, .w-cs .ljuser a:hover, .w-cs .ljuser a:active, .w-cs .ljuser a:link b, .w-cs .ljuser a:visited b, .w-cs .ljuser a:hover b, .w-cs .ljuser a:active b {font-size: 11px !important; font-weight: normal!important; text-transform: uppercase!important; text-transform: none; color: #999!important; font-family: 'Playfair Display', Georgia, serif!important; margin-left: 2px!important;}

.w-cs .w-cs-userinfo {background: url(http://i.imgur.com/AcVaJ1G.png) repeat scroll 0 0!important; color:#999; border:0px; font-family:'Droid Serif', Georgia, serif!important;}

.w-cs .w-cs-summary li.w-cs-i-tokens {border:0px;}

.w-cs a:link, .w-cs a:visited, .w-cs a:active {color:#999!important;}

.w-cs a:hover {color:#999!important;}

.w-cs .w-cs-summary {background-color: transparent!important; background-image: url('')!important;}

.w-cs-user-controls .w-cs-status p {background-color: transparent!important; color:#aaa!important; font-family:'Droid Serif', Georgia, serif!important; font-size:12px;}

.w-cs .w-cs-summary {background:transparent!important; color:transparent!important}

.w-cs .w-cs-search .w-cs-text {width: 150px; border-right: 25px solid #fff; background-color:#fff;}

.w-cs .w-cs-text {background-color: #fff!important;}

.w-cs .w-cs-search-inner {display:none;}

.w-cs .w-cs-menu li {background: none!important; padding-left: 0px!important;}

.w-cs .w-cs-menu li.w-cs-i-home a, .w-cs .w-cs-menu li.w-cs-i-post a, .w-cs .w-cs-menu li.w-cs-i-friends a, .w-cs .w-cs-menu li.w-cs-i-account a, .w-cs .w-cs-menu li.w-cs-i-faq a, .w-cs .w-cs-menu li.w-cs-i-recent a, .w-cs .w-cs-menu li.w-cs-i-entries a, .w-cs .w-cs-menu li.w-cs-i-invite a, .w-cs .w-cs-menu li.w-cs-i-add a, .w-cs .w-cs-menu li.w-cs-i-leave a, .w-cs .w-cs-menu li.w-cs-i-watch a, .w-cs .w-cs-menu li.w-cs-i-unwatch a, .w-cs .w-cs-menu li.w-cs-i-directory a, .w-cs .w-cs-menu li.w-cs-i-invites a, .w-cs .w-cs-menu li.w-cs-i-members a, .w-cs .w-cs-menu li.w-cs-i-members a.i-invites, .w-cs .w-cs-menu li.w-cs-i-catalogue a, .w-cs .w-cs-menu li.w-cs-i-edit a, .w-cs .w-cs-menu li.w-cs-i-manage a, .w-cs .w-cs-menu li.w-cs-i-gift a, .w-cs .w-cs-menu li.w-cs-i-tags a, .w-cs .w-cs-menu li.w-cs-i-message a, .w-cs .w-cs-menu li.w-cs-i-groups a, .w-cs .w-cs-menu li.w-cs-i-calendar a, .w-cs .w-cs-menu li.w-cs-i-friendsfriends a, .w-cs .w-cs-menu li.w-cs-i-like a, .w-cs .w-cs-menu li.w-cs-i-share a {padding-left: 0px; font: 11px 'Droid Serif' !important;}

.w-cs .w-cs-filter .w-cs-filter-icon {padding-left: 0px!important; background:none!important;}

.w-cs .w-cs-group-second .w-cs-menu {left: 5px!important; border: 0px!important; background: url(http://i.imgur.com/AcVaJ1G.png) repeat scroll 0 0!important;}

.w-cs .w-cs-group-second .w-cs-menu LI A, .w-cs .w-cs-menu LI SPAN {border-bottom: 0px!important;}

::-webkit-scrollbar {width:7px; height:7px;}

::-webkit-scrollbar-track-piece {background-color:#fff; border:3px solid #e6e6e6;}

::-webkit-scrollbar-thumb {background-color:#fff; border:2px solid #e6e6e6;}

::-webkit-scrollbar-thumb:hover {}

::-webkit-scrollbar-corner {background-color:#e6e6e6;}

.b-popup-contextual .i-popup-arrtl, .b-popup-contextual .i-popup-arrbl {display:none;}

.b-popup-contextual .i-popup-arrtr, .b-popup-contextual .i-popup-arrbr {display:none;}

.b-contextualhover {min-width:150px; width: auto; min-height: 44px; margin-left: 0px; color: #999; text-align: justify; font-size: 11px!important; font-family:'Droid Serif', Georgia, serif; line-height: 1.25;}

.b-contextualhover, .b-contextualhover div, .b-contextualhover p, .b-contextualhover ul, .b-contextualhover ol, .b-contextualhover li, .b-contextualhover label, .b-contextualhover img, .b-contextualhover span, .b-contextualhover h3, .b-contextualhover input {padding: 0; margin: 0; color: #999; font-size:11px!important;}

.b-contextualhover img {border: none;}

.b-contextualhover p {margin-bottom: 3px; font-size: 11px; line-height: 1.25;}

.b-contextualhover .input-checkbox {margin-right: 2px; vertical-align: middle;}

.b-contextualhover .b-contextualhover-section {overflow: hidden; padding: 0px;}

.b-contextualhover .b-contextualhover-side {margin: -10px -64px 0 0;}

.b-contextualhover .b-contextualhover-userpic {float: right; width: 55px; height: 55px; text-align: right;}

.b-contextualhover .b-contextualhover-userpic a, .b-contextualhover .b-contextualhover-userpic a:hover {border: none !important;}

.b-contextualhover .b-contextualhover-userpic img {max-width: 50px; max-height: 50px; padding: 5px; background: url(http://i.imgur.com/AcVaJ1G.png) repeat scroll 0 0;
border: 1px solid #e6e6e6;}

.b-contextualhover .b-contextualhover-title {padding-bottom: 0px;}

.b-contextualhover .b-contextualhover-title a:hover {text-decoration: none !important;}

.b-contextualhover .b-contextualhover-title h3 {color: #999; font-family:'Droid Serif', Georgia, serif; margin-bottom: 2px; font-weight: normal; font-style: normal; font-size: 11px; line-height: 1.25;}

.b-contextualhover .b-contextualhover-options {margin: 0; padding: 1px 0; border-top: 0px; list-style: none;}

.b-contextualhover .b-contextualhover-options li {margin-bottom: 0px; line-height: 1.25; font-size: 11px!important;}

.b-contextualhover .b-contextualhover-options li a:hover {text-decoration: none !important;}

.b-contextualhover .b-contextualhover-param {line-height: 18px; margin:0 0 6px;}

.b-contextualhover .b-contextualhover-param-item {list-style: none;}

.b-contextualhover-param-item .b-icon-scapital {margin:0 2px 0 0;}

.b-icon-scapital {float: left; width: 16px; height: 16px; margin:0 2px 0 0; background-image: url(/img/icon-social-capital.png?v=19876); background-repeat: no-repeat; background-position: 0 50%;}

.b-icon-scapital-first {background-position: -17px 50%;}

.b-popup-outer {position: relative; padding: 1px; background: #fff; border: 1px solid #e6e6e6; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; z-index: 100;}

.b-popup-inner {padding: 8px; border: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px;}

.b-popup div, .b-popup strong, .b-popup label {color: #888;}

BODY:not(.s-schemius) .b-contextualhover a:link, BODY:not(.s-schemius) .b-contextualhover a:active, BODY:not(.s-schemius) .b-contextualhover a:focus, BODY:not(.s-schemius) .b-contextualhover a:visited {border-bottom: 0 !important; text-decoration:none!important; color: #e6beed!important;}

BODY:not(.s-schemius) .b-contextualhover a:hover {border-bottom: 0 !important; text-decoration: none!important; color: #c88fc4!important;}INSTALLATION
(1) Apply any Smooth Sailing theme. Make sure the page set up is 2 Column (sidebar on left) or else the sidebar won't show. Set the ads to between entries or horizontal.
(2) Display → Navigation Strip color: Light gray.
(3) Entry Text → Format for Date and Time: %%dayord%% %%month%% %%yyyy%%. Additionally you can edit some of the text so that they look like in the preview.
(4) Menu → Shorten the links used for the navigation.
(5) Sidebar → Ordering: Free Text, Links, Latest Month. You can order the sideboxes as you want but keep in mind that only the first three of them will be visible.
(6) Custom CSS → Set all drop-down boxes to No and paste the code.NOTES AND CREDITS
→ Don't redistribute or claim as your own.
→ Credit is nice.
→ Tiny icons by pinvoke.com
→ Preview icon by astrokittie at chronophages
→ Original post here at ourhappyhours