049 - Layout 26 [Smooth Sailing: Catch That Magic Moment]: mentahelada

yam in mentahelada

049 - Layout 26 [Smooth Sailing: Catch That Magic Moment]

Aug 31, 2009 00:18

Hello!

Live preview | Image Preview
/********************DO NOT REMOVE THIS******************** Layout 026 [Catch That Magic Moment] by Yam @ MentaHelada (mentahelada.livejournal.com) ----------CREDITS: Icons: http://iconza.com/ Sidebar image by Kliverap (http://www.sxc.hu/photo/1191476) *************************************************************/ /*****BASIC LAYOUT*****/ body { background:#f4f4f4 url(http://www.mentahelada.net/lj-layouts/layout026/bg-body.jpg) top left repeat; color:#333; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:100%; line-height:104%; } .pageblock{ /*the content*/ background:transparent; margin:0 auto; width:960px; } .pageheaderblock { margin-bottom:20px; font-size:0.6875em/*11px*/; text-align:left; width:960px; margin:0 auto; } .bodyblock { /*entries + sidebar*/ background:transparent; margin:10px auto 0; overflow:hidden; } .sidebar { background:transparent url(http://www.mentahelada.net/lj-layouts/layout026/bg-sbar.jpg) top left no-repeat; width:410px; /*margin-right:10px;*/ padding-top:276px; font-size:0.6875em/*11px*/; } /*****BASICS*****/ * {margin: 0; padding: 0;} .ippu {font-size:11px;} a{outline:none;} a img{border:0;} p, td {font-size:inherit;} code, kbd, pre, tt {font-family:monospace;} i, em{font-style:italic;} textarea {max-width:440px;} .clear{height:0;} .lj_embedcontent{max-width:440px;} /**/ #lj_controlstrip {background:#333!important; border-bottom:1px solid #ccc; padding:3px; color:#f4f4f4!important;} #lj_controlstrip a, #lj_controlstrip a b{color:#f4f4f4; text-decoration:underline; text-transform:none;} #lj_controlstrip a:hover{text-decoration:none;} #lj_controlstrip_statustext{color:#e3316b; font-weight:100;} #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search{border:0;} /**/ a, a:link, a:visited { color:#e3316b; font-weight:900; text-decoration:none; text-transform:none; } a:hover { color:#333; text-decoration:underline; } blockquote { background:#6a931d; margin:10px auto; padding:20px; width:60%; color:#f4f4f4; font:italic normal 100 1.0909em Georgia, "Times New Roman", Times, serif; text-align:left; line-height:1.6em; } blockquote a{color:#292929!important; text-transform:none!important;} ::-moz-selection {background:#ccc;color:#333;} b, strong{color:#111;font-weight:900;} /*****HEADER*****/ .header-title, .header-subtitle, .header-icon {display:none;} .header-menu ul{} .header-menu li{display:inline;} .header-menu { background:#333; border-bottom:1px solid #ccc; border-left:1px solid #ccc; border-right:1px solid #ccc; padding:30px 0 6px; } .header-menu a, .header-menu a:link, .header-menu a:visited { background:#333; border-right:1px solid #ccc; margin:0; padding:30px 8px 6px 15px; color:#f4f4f4; font-weight:normal!important; letter-spacing:0.14em; text-decoration:none; text-transform:uppercase; } .header-menu a:hover { background:#6a931d; padding:30px 8px 6px 15px; color:#f4f4f4; } /*****SIDEBAR*****/ .sidebar a{text-decoration:none; text-transform:none;} .sidebox { background:#f4f4f4; border:1px solid #ccc; float:left; width:195px; height:225px; background:#f4f4f4; margin-bottom:10px; margin-left:3px; overflow:auto; } .sideboxTitle, .listtitle { background:#f4f4f4; padding:15px 5px 5px; color:#333; font-size:1.2em; text-align:left; text-transform:lowercase; letter-spacing:0.18em; } .sideboxContent {text-align:left;padding:5px 0;} .sidebox #systemlinks {text-align:left;} .summaryList{padding-bottom:10px;} #profile {text-align:center;} #summary, #search, #tags_sidebox, #freetext {padding:5px;} .listitem a, .listitem a:link, .listitem a:visited { background:transparent; border-bottom:1px solid #ccc; display:block; padding:3px 8px; color:#333; font-size:1em; font-weight:100; } .listitem a:hover { background:#ccc; border-bottom:1px solid #ccc; color:#292929; } .sidebox #summary a, .sidebox #tags_sidebox a{ background:transparent; color:#333; font-size:1em; font-weight:100; } .sidebox #summary a:hover, .sidebox #tags_sidebox a:hover {color:#e3316b;} .sidebox #latestmonth table{ width:90%; margin-left:auto; margin-right:auto; text-align:center; } .latestmonth-active{ background:#e3316b; border:1px solid #e3316b; margin:1px; padding:3px; } .latestmonth-inactive{ background:transparent; border:1px solid #ccc; margin:1px; padding:3px; } .latestmonth-active a, .latestmonth-active a:link, .latestmonth-active a:active { color:#f4f4f4; text-decoration:none; } .latestmonth-active a:hover{text-decoration:underline;} .latestmonth-active:hover { background:#333; border:1px solid #333; } .profile-label { color:#e3316b; font-weight:100; } /*****BODY*****/ .bodyheaderblock {display:none;} .body-title {display:none;} .bodynavblock {background:transparent; padding:20px;} .bodynavblock a{color:#f4f4f4;font-weight:100;} .body-midtitle {display:none;} /*****FOOTER *****/ #footer-menu { background:transparent; font-size:0.6875em/*11px*/; padding:10px; text-align:right; } #footer-menu ul {list-style:none;} #footer-menu li {display:inline;} #footer-menu a, #footer-menu a:link, .footer-menu a:visited { background:#333; border:1px solid #ccc; padding:5px; margin:2px; color:#f4f4f4; text-decoration:none; text-transform:uppercase; } #footer-menu a:hover{ background:#6a931d; color:#f4f4f4f; } .pagefooterblock { /*the "this page was loaded..." part*/ background:transparent; padding:3px; color:#f4f4f4; font-size:0.625em/*10px*/; text-align:center; text-transform:uppercase; } .pagefooterblock a, .pagefooterblock a:link, .pagefooterblock a:visited { color:#e3316b; text-decoration:underline; text-transform:none; } .pagefooterblock a:hover {text-decoration:none;} /*****ICONS*****/ .entryUserinfo, .commentUserinfo{ background:transparent; text-align:left; margin:10px 0; } .entryUserinfo a, .commentUserinfo a{ font-size:0.85em; color:#333; } .entryUserinfo b, .entryUserinfo strong, .commentUserinfo b, .commentUserinfo strong{ font-weight:100; color:#333; } .entryUserinfo-username, .commentUserinfo-username { padding-top:5px; margin:0 0 20px 10px; font-size:11px!important; } .commentUserinfo-usericon a{color:#333;} .entryUserinfo-username{ padding-top:5px; margin:0 0 20px 10px; } .entryUserinfo-usericon a img, .commentUserinfo-usericon a img{ background:transparent; margin:0 10px; width:75px; height:auto; } .entryUserinfo-usericon a:hover img, .commentUserinfo-usericon a:hover img{ background:transparent; margin:0 10px; } /*****ENTRY / COMMENTS*****/ #welcomenoteText{background:#f4f4f4; border:1px solid #ccc;} .entryHolder, .commentHolder { background:#f4f4f4; border:1px solid #ccc; margin-bottom:20px; font-size:0.75em/*12px*/; } .entryText { background:#f4f4f4; line-height:1.7em; min-height:130px; margin:10px 10px 0 0; } .commentText {padding:10px;} /*--1st line: all images posted will have a fixed width. 2nd line: a fix for polls--*/ .entryText img{max-width:440px;height:auto;} .entryText table tbody img, .entryText p span img{width:auto;height:auto;} .entryText ul li { list-style:square; margin-left:25px; padding-left:0px; } .entryText ol li { list-style:lower-alpha; margin-left:25px; padding-left:0px; } .entryHeader, .commentHeader { /*date / time container*/ background:#f4f4f4; overflow:hidden; padding:10px; color:#333; font-weight:100; clear:both!important; } .entryHeaderSubject, .commentHeaderSubject { font-size:1.2em; font-style:normal; font-weight:100; line-height:1.2em; letter-spacing:0.09em; text-transform:none; overflow:hidden; } .entryHeaderDate { background:#f4f4f4; display:block; color:#999; font-size:0.9em; letter-spacing:0.14em; text-align:right; text-decoration:none; } .entryHeader a, .entryHeader a:link, .entryHeader a:visited, .commentHeader a, .commentHeader a:link, .commentHeader a:visited{ color:#333; font-weight:100; text-decoration:none; text-transform:none; } .entryHeader a:hover, .commentHeader a:hover{ color:#e3316b; text-decoration:none; } .entryMetadata { background:#f4f4f4; border-top:1px solid #ccc; padding:10px; text-align:right; } .entryMetadata-content {padding-left:5px;} .entryMetadata a{text-transform:none;} .entryMetadata-label {font-weight:100;} .entryMetadata li { background:transparent; display:block; list-style:none; margin:2px 0; padding:2px 0; } .entryLinkbar, .commentLinkbar { background:#f4f4f4; border-top:1px solid #ccc; padding:7px 0; font-size:0.8em; color:#163b58; text-align:left; } .entryLinkbar li, .commentLinkbar li { display:inline; list-style:none; font-weight:100; } .entryLinkbar li a, .entryLinkbar li a:link, .entryLinkbar li a:visited, .commentLinkbar li a, .commentLinkbar li a:link, .commentLinkbar li a:visited{ background:#f4f4f4; border-right:1px solid #ccc; padding:7px 6px; color:#999; text-decoration:none; text-transform:lowercase; } .entryLinkbar li a:hover, .commentLinkbar li a:hover { background:#6a931d; color:#f4f4f4; text-decoration:none; } .commentHeaderScreened{ background:#999; padding:10px; color:#f4f4f4; text-transform:none; } .replyform { background:#f4f4f4; padding:10px; color:#333; } #qrform table { border:0!important; margin:5px; padding:5px; height:auto; } #commenttext{width:100%;} #qrdiv, #qrformdiv{background:#f4f4f4;} #postform{font-size:0.75em/*12px*/;} /*****ARCHIVE PAGE *****/ .month { background:#f4f4f4; margin:30px auto; width:70%; } .daysubjects { background:#f4f4f4; color:#333; padding:30px 10px; } .daytitles { background:transparent; border:0; height:2em; color:#e3316b; font-size:1.1666em/*14px*/; text-align:center; } .day-blank { background:#292929; border:2px solid #f4f4f4; } .day{ background:#ccc; border:2px solid #f4f4f4; padding:2px; color: #333; } .day-date { border:0; color:#333; width:50%; text-align:center; } .day-count { float:right; text-align:center; width:50%; font-size:1.6666em/*20px*/; } .day-count a, .day-count a:link, .day-count a:visited { color:#e3316b; text-decoration:none; } .day-count a:hover { color:#333; text-decoration:none; } /*****TAGS PAGE *****/ .tagstable { margin:10px auto; width:90%; font-family:Georgia, "Times New Roman", Times, serif; font-size:1.1666em/*14px*/; } .tagstable td { background:transparent; border:2px solid #ccc; padding:5px; } /*****LJ-USER / COMMUNITY / PROTECTED ICONS*****/ .ljuser img { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout026/icon-user.png) no-repeat; padding: 16px 16px 0 0!important;} .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout026/icon-user.png) no-repeat; padding: 16px 16px 0 0!important;} .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout026/icon-home.png) no-repeat; padding: 16px 16px 0 0!important;} .entryHeaderSubject img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout026/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important;} .summaryList img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout026/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important;} .subject img[src="http://l-stat.livejournal.com/img/icon_protected.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout026/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important;} .entryHeaderSubject img[src="http://l-stat.livejournal.com/img/icon_private.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout026/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important;} .entryHeaderSubject img[src="http://l-stat.livejournal.com/img/community.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout026/icon-home.png) no-repeat; padding: 16px 16px 0 0!important;} .entryHeaderSubject img[src="http://l-stat.livejournal.com/img/userinfo.gif"]{ width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout026/icon-user.png) no-repeat; padding: 16px 16px 0 0!important;} .daysubjects img[src="http://l-stat.livejournal.com/img/icon_protected.gif"]{ width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout026/icon-lock.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout026/icon-user.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout026/icon-user.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background:transparent url(http://www.mentahelada.net/lj-layouts/layout026/icon-home.png) no-repeat; padding: 16px 16px 0 0!important;} /*****CONTEXTUAL POPUP****/ div.ContextualPopup img {border:0;} div.ContextualPopup div.Inner {background:#f4f4f4!important; padding:5px;color:#333!important; font-size:1em; font-weight:100!important;border:2px solid #ccc;} div.ContextualPopup .Content {font-weight:100!important; margin-right:50px;} div.ContextualPopup .Relation {font-size:1.2727em/*14px*/; font-weight:100!important;color:#e3316b!important;} div.ContextualPopup .Content .OnlineStatus {font-weight:100!important;} div.ContextualPopup .Userpic {font-weight:100!important;} div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited {color:#e3316b!important;font-weight:100; text-decoration:none!important; text-transform:none;} div.ContextualPopup div.Inner a:hover{color:#ccc!important;font-weight:100; text-decoration:underline!important;}

CSS

CSS
LAYOUT INFO:

Style: Smooth Sailing
Account level: Basic, Paid, Plus
Tested on: IE (7 and higher), Firefox Safari and Chrome.

IMAGES:
Please upload the images to your own server. Thanks.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Credits:
All mini icons: Iconza
Sidebar image @ version 1: Kliverap
Sidebar image @ version 2: Pink Sherbet
Sidebar image @ version 3: Mattox
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

User, community, locked/protected icons:

Body background: http://www.mentahelada.net/lj-layouts/layout026/bg-body.jpg
Sidebar image @ version 1: http://www.mentahelada.net/lj-layouts/layout026/bg-sbar.jpg
Sidebar image @ version 2: http://www.mentahelada.net/lj-layouts/layout026/bg-sbar2.jpg
Sidebar image @ version 3: http://www.mentahelada.net/lj-layouts/layout026/bg-sbar3.jpg

Carlisle icon in the preview made by me. Find it here.
BASIC INSTRUCTIONS:

Choose a Smooth Sailing layout
Under "3. Choose a Page Setup" choose "2 Column (sidebar on left)" and apply the layout
Go to the customize main page and, under "Additional Options", choose "no" in "Wrap Entry text under userinfo" line. Save
Go to the Custom CSS page
Select NO in the dropdowns
Leave "Custom External Stylesheet" empty
Paste the CSS that I give you in the "Custom Stylesheet" box. Save your changes.

Make changes if you know how (but still credit me!)
Ask if you have doubts, I'll try to answer asap

CHANGE THE SIDEBAR IMAGE:
It's pretty easy. Find this part of the code:

.sidebar {
background:transparent url(http://www.mentahelada.net/lj-layouts/layout026/bg-sbar.jpg) top left no-repeat;
width:410px;
/*margin-right:10px;*/
padding-top:276px;
font-size:0.6875em/*11px*/;
}

And change the URL to your own. The image must be 400x266px to fit the layout.

EASY RULES:

Credit mentahelada if you use. Please don't credit mintyapple, please change the credit you have in your userinfo. Thanks!
Comment if you like / if you take

@ mintyapple

layouts:smooth sailing, layouts