043 - Layout 21 [Smooth Sailing: Looks Like Morning In Your Eyes]: mentahelada

yam in mentahelada

043 - Layout 21 [Smooth Sailing: Looks Like Morning In Your Eyes]

Apr 22, 2009 21:34

Hello! I'm working on a new layout for the community, so it's time to share the current one. Enjoy! :)

Live preview | Image preview
/********************DO NOT REMOVE THIS******************** Layout 021 [Looks Like Morning In Your Eyes] by Yam @ Frozen Mint (frozen_mint.livejournal.com) ----------CREDITS: Wood background: http://graphicssoft.about.com Header image: http://dryicons.com/ Icons by Splashyfish: http://splashyfish.com/icons/ ************************************************************/ /*****BASIC LAYOUT*****/ body { background:#fff url(http://www.mentahelada.net/lj-layouts/layout021/bg-body.jpg) top left repeat; color:#303030; font-family:"Trebuchet MS", "Lucida Sans", Arial, Helvetica, sans-serif; font-size:100%; } .pageblock{ /*the content*/ background:transparent; margin:0 auto; width:919px; } .pageheaderblock { background:transparent url(http://www.mentahelada.net/lj-layouts/layout021/bg-header.png) top center no-repeat; padding-bottom:52px; font-size:0.8125em/*13px*/; text-align:left; } .bodyblock { /*entries + sidebar*/ background:#fff; font-size:0.75em/*12px*/; } .sidebar { background:transparent; margin:0 20px 0 0; padding-left:10px; width:250px; } /*****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:400px;} .clear{height:0;} .lj_embedcontent{max-width:450px;} ::-moz-selection {background:#eae8e8; color:#ec008c;} b, strong{color:#ec008c; font-weight:900;} #lj_controlstrip {background:#fff!important; border-bottom:1px solid #d4d4d4; padding:3px; color:#ec008c!important;} #lj_controlstrip a{color:#ec008c; text-decoration:underline; text-transform:none;} #lj_controlstrip a:hover{color:#303030; text-decoration:none;} #lj_controlstrip_statustext{color:#ec008c; font-weight:100;} #lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_search{border:0;} a, a:link, a:visited { color:#ec008c; font-weight:200; text-decoration:none; text-transform:none; } a:hover { color:#303030; border-bottom:1px dotted #ec008c; } blockquote { background:#fff; border-left:40px solid #d7df21; margin:10px 0; padding:15px 10px 15px 5px; width:80%; color:#303030; font-size:1.3em; font-style:italic; text-align:left; line-height:1.3em; } /*****HEADER*****/ .header-title { padding:70px 10px 0 0; color:#fff; font-family:"Trebuchet MS", "Lucida Sans", Arial, Helvetica, sans-serif; font-size:2.5em; font-variant:normal; font-style:italic; letter-spacing:-0.04em; text-align:right; } .header-subtitle { padding-right:20px; color:#d7df21; font-family:Georgia, "Times New Roman", Times, serif; font-size:1.5em; text-transform:lowercase; font-style:italic; text-align:right; } .header-icon {display:none;} .header-menu li{display:inline;} .header-menu { background:transparent url(http://www.mentahelada.net/lj-layouts/layout021/bg-nav-green.png) repeat; border:1px solid #e8e8e8; margin:70px 10px 0; padding:20px 00; overflow:hidden; font-family:Georgia, "Times New Roman", Times, serif; text-align:right; } .header-menu a, .header-menu a:link, .header-menu a:visited { background:transparent; border-left:1px solid #e8e8e8; padding:20px 10px; color:#575757; font-weight:100!important; text-decoration:none; text-transform:uppercase; } .header-menu a:hover { background:#d7df21; padding:20px 10px; color:#464646; } /*****SIDEBAR*****/ .sidebar a{ color:#06b2f3; text-decoration:none; } .sidebar a:hover{ border-bottom:1px dotted #06b2f3; color:#303030; } .sidebox { background:transparent; margin-bottom:20px; } #freetext{font-size:1.2em;} #freetext b{color:#06b2f3; font-weight:100;} .sideboxTitle { background:transparent; color:#ec008c; font-family:"Trebuchet MS", "Lucida Sans", Arial, Helvetica, sans-serif; font-size:2.5em; font-style:italic; letter-spacing:-0.04em; } .listtitle { /*titles in the link list*/ background:transparent; margin-top:15px; color:#ec008c; font-family:"Trebuchet MS", "Lucida Sans", Arial, Helvetica, sans-serif; font-size:2.5em; font-style:italic; letter-spacing:-0.04em; } .sideboxContent { text-align:left; padding:0; } .sidebox #systemlinks {text-align:left;} #summary, #search, #tags_sidebox {padding:0;} .summaryList{padding-bottom:5px; border-bottom:1px solid #d7df21;} .sidebox #summary b{ color:#ec008c; line-height:2em; } .sidebox #summary a{ background:transparent; margin-bottom:1px; color:#303030; font-size:1.1666em/*14px*/; font-weight:100; } .sidebox #summary a:hover { color:#06b2f3; text-decoration:none; } .listitem a, .listitem a:link, .listitem a:visited { background:transparent; border-bottom:1px solid #06b2f3; display:block; padding:3px 8px; color:#303030; font-size:1.1666em/*14px*/; font-weight:100; } .listitem a:hover { background:#06b2f3; border-bottom:1px solid #06b2f3; color:#303030; text-decoration:none; } .sidebox #latestmonth table{ width:95%; margin-left:auto; margin-right:auto; text-align:center; } #latestmonth a{color:#06b2f3;} #latestmonth a:hover{color:#303030; border:0;} .latestmonth-active{ background:#ec008c; border:1px solid #ec008c; 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!important; text-decoration:none; } .latestmonth-active a:hover{ text-decoration:underline; } .latestmonth-active:hover { background:#303030; border:1px solid #303030; } .profile-label { /*bold words in the profile blurb*/ color:#ec008c; font-weight:900; } /*****BODY*****/ .bodyheaderblock {display:none;} /*the title above entry, is NOT child of .bodyblock*/ .body-title {display:none;} /*the title above entry :/ is NOT child of .bodyblock*/ .bodynavblock {background:transparent; margin:0 10px 10px;} /*the body footer omg.wtf.with.the.classes.names*/ .bodynavblock a, .bodynavblock a:link, .bodynavblock a:visited {} .bodynavblock a:hover{} .body-midtitle {display:none;} /*the title/separator of the comments*/ /*****FOOTER*****/ #footer-menu li{display:inline;} #footer-menu { background:transparent; border-bottom:1px solid #fff; padding:10px 0; margin-top:10px; overflow:hidden; text-align:right; } #footer-menu a, #footer-menu a:link, .footer-menu a:visited { background:#d7df21; border-right:1px solid #e8e8e8; padding:20px 10px; color:#464646; font-weight:100!important; text-decoration:none; text-transform:uppercase; } #footer-menu a:hover { background:#06b2f3; padding:20px 10px; color:#fff; } .pagefooterblock { /*the "this page was loaded..." part*/ background:transparent; padding:10px 0; color:#fff; font-size:0.6875em/*11px*/; text-align:right; text-transform:uppercase; } .pagefooterblock a, .pagefooterblock a:link, .pagefooterblock a:visited { color:#d7df21; text-decoration:underline; text-transform:none; } .pagefooterblock a:hover {text-decoration:none;} /*****ENTRY*****/ #welcomenoteText{} .entryHolder { background:transparent; margin-bottom:50px; margin-right:10px; } .entryUserinfo { /*around the icon / user*/ text-align:left; margin-bottom:10px; } .entryUserinfo a{font-size:0.9166em/*11px*/; color:#303030;} .entryUserinfo a:hover{color:#ec008c;} .entryUserinfo b, .entryUserinfo strong{font-weight:100;color:#303030;} .entryUserinfo-username{padding-top:5px;margin-bottom:20px;} .entryUserinfo-usericon img {} .entryUserinfo-usericon a{border-bottom:0!important;} .entryUserinfo-usericon a img{ background:transparent; border:1px solid #eae8e8; padding:10px; margin:10px 10px 0 0; } .entryUserinfo-usericon a:hover img{ background:transparent; border:1px solid #aee9ff; padding:10px; margin:10px 10px 0 0; } .entryText { padding:10px 0 10px 0; line-height:1.6em; max-width:474px; } /*--1st line: all images posted will have a fixed width. 2nd line: a fix for polls--*/ .entryText img{max-width:470px;height:auto;} .entryText table tbody img, .entryText p span img{width:auto;height:auto;} .entryText ul li { list-style:circle; margin-left:30px; padding-left:0px; } .entryText ol li { list-style:decimal-leading-zero; margin-left:30px; padding-left:0px; } .entryHeader { /*date / time container*/ background:transparent; overflow:hidden; padding:0; color:#303030; font-variant:small-caps; font-weight:100; clear:both!important; } .entryHeaderSubject { float:left; padding:0 0 0; color:#06b2f3; font-size:2.0833em/*24px*/; font-style:normal; line-height:1em; } .entryHeaderDate { float:right; color:#303030; font-size:1.09em; text-decoration:none; } .entryHeader a, .entryHeader a:link, .entryHeader a:visited{ border-bottom:0!important; color:#06b2f3; font-weight:100; font-variant:small-caps; text-decoration:none; text-transform:none; } .entryHeader a:hover{color:#ec008c;text-decoration:none;} .entryMetadata { background:transparent; border-top:3px solid #d7df21; margin-bottom:10px; padding-left:5px; text-align:left; } .entryMetadata li { background:transparent; display:block; list-style:none; margin:3px 0; padding:2px 0; } .entryMetadata-label { color:#ec008c; font-weight:100; font-variant:small-caps; } .entryMetadata-content { padding-left:5px; color:#303030; font-weight:100; font-variant:none; } .entryMetadata-content a{ color:#303030; border-bottom:1px dotted #d7df21; font-weight:100; font-variant:none; } .entryMetadata-content a:hover{ color:#ec008c; border-bottom:1px dotted #ec008c; font-weight:100; font-variant:none; } .entryLinkbar { background:transparent; border-bottom:3px solid #06b2f3; padding:10px 0; font-size:0.9em; color:#163b58; text-align:center; } .entryLinkbar li { display:inline; list-style:none; font-weight:100; } .entryLinkbar li a, .entryLinkbar li a:link, .entryLinkbar li a:visited{ background:transparent; padding:3px 7px 10px; color:#ec008c; text-decoration:none; text-transform:uppercase; } .entryLinkbar li a:hover { border-top:2px solid #ec008c; border-bottom:0!important; text-decoration:none; } /*****COMMENT PAGE *****/ .commentHolder { background:#fff; color:#303030; margin:10px 0; } .commentUserinfo { margin:0; padding:0; text-align:left; } .commentUserinfo-usericon a{color:#303030; border-bottom:0!important;} .commentUserinfo b, .commentUserinfo strong{font-weight:100;color:#303030;} .commentUserinfo-username {padding-top:5px;margin-bottom:20px;font-size:11px!important;} .commentUserinfo-usericon a img{ background:transparent; border:1px solid #eae8e8; padding:10px; margin:10px 10px 0 0; } .commentUserinfo-usericon a:hover img{ background:transparent; border:1px solid #aee9ff; padding:10px; margin:10px 10px 0 0; } .commentText {padding:10px 0;} .commentHeader { background:#fff; border-top:3px solid #d7df21; padding:10px; color:#303030; text-transform:none; } .commentHeader a, .commentHeader a:link, .commentHeader a:visited{color:#303030;text-decoration:underline;} .commentHeader a:hover {text-decoration:none;} .commentHeaderScreened { /*this changes just the commentHeader*/ background:#999; padding:10px; color:#fff; text-transform:none; } .commentHeaderSubject { color:#00aeef; font-size:1.2em; font-weight:100; text-transform:uppercase; } .commentLinkbar { background:transparent; padding:10px; font-size:0.9166em/*11px*/; color:#ec008c; text-align:right; } .commentLinkbar li { display:inline; list-style:none; font-weight:100; } .commentLinkbar li a, .commentLinkbar li a:link, .commentLinkbar li a:visited{ background:#ec008c; padding:3px; margin:1px; color:#fff; text-decoration:none; } .commentLinkbar li a:hover { background:#fff; border-bottom:1px solid #d7df21; color:#303030; } .replyform { background:#fff; padding:10px; color:#303030; } #qrform table { border:0!important; margin:5px; padding:5px; height:auto; } #commenttext{width:100%;} /*****ARCHIVE PAGE *****/ .month {margin:10px auto;width:90%;} .daysubjects {color: #303030;padding:10px;} .day-blank {background:transparent;border:0;} .daytitles { background:transparent; border:0; height:2em; color:#ec008c; font-size:1.1666em/*14px*/; text-align:center; } .day{ background:transparent; border:1px solid #ccc; color: #303030; } .day-date { border:0; color:#303030; 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:#ec008c;text-decoration:none;} .day-count a:hover {color:#303030;text-decoration:underline;} /*****TAG PAGE*****/ .tagstable { margin:10px auto; width:90%; font-size:1.1666em/*14px*/; } .tagstable td { background:transparent; border:1px solid #ccc; padding:5px; } /*****LJ-USER / COMMUNITY / PROTECTED ICONS*****/ .ljuser img { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout021/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/layout021/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/layout021/icon-group.png) no-repeat; padding: 16px 18px 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/layout021/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/layout021/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/layout021/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/layout021/icon-lock.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/layout021/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/layout021/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/layout021/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/layout021/icon-group.png) no-repeat; padding: 16px 18px 0 0!important; } /*****CONTEXTUAL POPUP*****/ div.ContextualPopup img {border:0 none;} div.ContextualPopup div.Inner {background:#fff!important; border:1px solid #ccc; padding:5px; color:#303030!important; font-size:1em; font-weight:100!important;} div.ContextualPopup .Content {margin-right:50px; font-weight:100!important;} div.ContextualPopup .Relation {color:#00aeef; font-size:1.4em/*14px*/; font-weight:500!important; font-style:italic;} 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:#ec008c!important; font-weight:100; text-decoration:none!important;} div.ContextualPopup div.Inner a:hover{color:#303030!important; font-weight:100; text-decoration:none!important;}
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.
Body background: http://www.mentahelada.net/lj-layouts/layout021/bg-body.jpg
Header: http://www.mentahelada.net/lj-layouts/layout021/bg-header.png
Header-links background: http://www.mentahelada.net/lj-layouts/layout021/bg-nav-green.png
User, community, locked/protected icons:

Bellatrix icon in the preview made by me. Find it here.
(Credits)
Wood pattern by GraphicSoft
Swirly vector image in header DryIcons
Icons by Splashyfish

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

EASY RULES:

Credit frozen_mint 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