Layout 035 : Black Cat

[malionette]

Click for a Live Preview.


( Layout ) #035 : Black Cat
Happy Friday the 13th! We celebrate with an exclusive Fruitstyle layout. Have you guys read The Black Cat by Edgar Allan Poe? He's one of my favourite short story writers.

( Install ) Step 1 - System

Select Theme

1. Select any S2 Minimalism - Penguins layout.

← Previous Step | 1 | 2 | 3 | Next Step →

( Install ) Step 2 - Stylesheet

Custom CSS

1. Use layout's stylesheets: No. IMPORTANT!!
   
   
2. Custom Stylesheet: /* S2 MINIMALISM --- 035 Black Cat ---
   Wingweaver22 @ Fruitstyle.livejournal.com
   Do not remove this note. */
   
   /* ----------------------------- PAGE ----------------------------- */
   
   html {margin: 0; padding: 0; }
   body { font-family: "Georgia", "Times", Times New Roman, Serif; font-size: 11px; color: #999999; background: #000000;
   padding: 0px 50px 0 50px !important; margin: 0; }
   
   a {text-decoration: none; color: #ffffff; border-bottom: 1px dotted #999999; outline-style:none; outline-width:0; }
   a:hover {color: #999999; }
   
   input, textarea, select {background: #000000; border: 1px solid #444444; color: #999999; font-family: georgia; font-size: 11px; }
   blockquote {background: url(http://i34.tinypic.com/nmyc2d.jpg); padding: 20px; }
   
   .hr hr {border: 0;}
   
   /* ----------------------------- HEADER ----------------------------- */
   
   .u-wrap, .header h3 {display: none; }
   
   .header {position: relative; float: right; width: 300px; }
   .header h2 {font-size: 24px; text-transform: uppercase; color: #ffffff; margin: 20px 20px 0 20px;
   padding: 0 0 20px 0; letter-spacing: 1px; border-bottom: 10px solid #444444; }
   
   .nav, .nav-sub { margin: 0 20px 0px 20px; padding: 0; list-style: none; }
   .nav li, .nav-sub li {}
   .nav li a, .nav-sub li a { display: block; padding: 5px 10px 5px 10px; border-bottom: 1px solid #444444; text-transform: uppercase; font-size: 9px;
   letter-spacing: 2px; color: #666666; }
   .nav li a:hover, .nav-sub li a:hover { color: #999999; border-bottom-style: dotted; }
   
   .nav .item-selected a {color: #999999; border-bottom-style: dotted; }
   
   /* ----------------------------- SIDEBAR ----------------------------- */
   
   .sidebar {float: right; width: 100%; }
   .sidebar-inner { position: relative; width: 300px; overflow:hidden; float: right; }
   .sidebar-block { padding: 0 20px 0 20px; }
   
   .sidebar dt {font-size: 18px; color: #ffffff; text-transform: uppercase; font-weight: bold; letter-spacing: 2px; margin: 20px 0 20px 0;
   border-bottom: 10px solid #444444; padding: 0 0 20px 0; }
   .sidebar dd {margin: 0; padding: 0; }
   
   .sidebar-cal table {width: 100%; text-align: center; border-collapse: collapse; }
   .sidebar-cal caption { text-transform: uppercase; font-size: 9px; padding-bottom: 20px; letter-spacing: 3px; }
   .sidebar-cal td, .sidebar-cal th {padding: 3px; border-bottom: 1px solid #444444; color: #666666; }
   .sidebar-cal td:hover { border-bottom-style: dotted; color: #999999; }
   
   .sidebar-summary ul { padding: 0 0 0 30px; margin: 0; list-style: upper-roman; color: #666666; }
   .sidebar-summary li { font-size: 9px; letter-spacing: 1px; margin: 0 0 10px 0; }
   
   .sidebar-links dt {margin-bottom: 10px; }
   .sidebar-links a {display: block; font-size: 9px; text-transform: uppercase; letter-spacing: 1px; padding: 0 0 5px 10px; margin: 0 0 5px 0;
   color: #666666; border-bottom: 1px solid #444444; }
   .sidebar-links a:hover {border-bottom-style: dotted; color: #999999; }
   
   dd.tags a {border-bottom: 0; }
   dd.tags ul {margin: 0; padding: 0 0 0 30px; list-style: upper-roman; color: #666666;}
   dd.tags li {font-size: 9px; letter-spacing: 1px; margin: 0 0 10px 0; text-transform: uppercase;}
   
   .sidebar-powered {display: none; }
   
   /* ----------------------------- CONTENT ----------------------------- */
   
   .content .hr hr {border: 0; padding: 3px; margin: 0; background: url(http://i34.tinypic.com/nmyc2d.jpg); clear: both; }
   
   .content { float: left; width: 100%; margin: 0 -100% 0 0; }
   .entry {padding: 20px; margin: 0; }
   .content-inner { position:relative; margin: 0 300px 0 0px; overflow: hidden; background: #1a1a1a; padding: 0; }
   
   .entry-title {font-size: 18px; font-weight: bold; text-transform: uppercase; color: #ffffff;
   margin: 0; padding: 0 50px 20px 0; letter-spacing: 2px; border-bottom: 1px solid #444444; }
   .entry-title a {border-bottom: 0; }
   .entry-title .ljuser b {font-weight: bold; font-size: 18px; }
   .entry-title img {margin-right: 5px !important;}
   
   .entry-text {margin: 0; padding: 0; }
   .entry-content { clear: left; border-top: 1px dashed #444444; padding: 20px 0 0 0; }
   
   .entry-content img {padding: 10px; background: #000000;}
   .entry-content a img:hover {background: #1a1a1a; }
   
   /* ----------------------------- STICKY POST ----------------------------- */
   
   #post-sticky {background: url(http://i34.tinypic.com/nmyc2d.jpg);}
   .content-inner-in > .disabledcomments + .hr {display: none;}
   #post-sticky .entry-content {border: 0; }
   
   /* ----------------------------- ENTRY ----------------------------- */
   
   .vcard dt img {float: right; border: 10px solid #000000; margin-top: -40px; }
   .vcard dd {margin: 10px 10px 10px 0; float: left; font-size: 9px; text-transform: uppercase; letter-spacing: 2px; color: #666666;}
   .vcard a {color: #999999; letter-spacing: 1px; }
   .vcard a:hover { color: #666666; border-color: #666666; }
   
   .metadata { margin: -20px 0 20px 0; padding: 0; }
   .metadata dt {float: left; }
   .metadata dd { padding: 3px 0 3px 20px; margin: 0px 10px 0 0; font-size: 9px; text-transform: uppercase; letter-spacing: 1px; color: #666666;
   border-bottom: 1px dashed #444444; z-index: 20; }
   .metadata dd img { margin: 3px 3px 0 0; padding: 0; background: transparent; }
   .metadata a {border-bottom-color: #666666; color: #999999; }
   
   .meta-location-label {font-size: 0px; color: transparent; background: url(http://i35.tinypic.com/105xn2u.jpg) no-repeat center center;
   padding: 16px 0 0 7px;}
   .meta-mood-label {font-size: 0px; color: transparent; background: url(http://i35.tinypic.com/33acvo5.jpg) no-repeat center center;
   padding: 19px 0 0 7px;}
   .meta-music-label {font-size: 0px; color: transparent; background: url(http://i37.tinypic.com/1jvldw.jpg) no-repeat center center;
   padding: 15px 0 0 7px;}
   
   .entrymenu, .entrysubmenu {padding: 0; margin: 0; text-transform: uppercase; font-size: 9px; }
   
   .entrymenu ul {list-style: none; padding: 10px 0 0 0; margin: 20px 0 0 0; border-top: 1px dashed #666666; }
   .entrymenu li {float: left; }
   .entrymenu li a {border-bottom: 0; padding: 5px; }
   .entrysubmenu li {list-style: none; float: left; }
   .entrysubmenu li a {border-bottom: 0; color: #666666; padding: 5px; }
   .entrysubmenu li a:hover {color: #999999; }
   
   .ljtags {font-size: 0px; color: transparent; background: url(http://i38.tinypic.com/2s0cyah.jpg) no-repeat left center; padding: 0px 0 0 7px;
   margin: 20px 0 0 0; }
   .ljtags a {font-size: 9px; margin-left: 10px; text-transform: uppercase; letter-spacing: 1px; border: 0; }
   
   .content-tags ul {list-style: upper-roman; color: #666666; }
   .content-tags a {font-size: 9px; text-transform: uppercase; letter-spacing: 2px;}
   
   /* ----------------------------- FOOTER ----------------------------- */
   
   .page-nav {text-align: center; font-size: 9px; text-transform: uppercase; padding: 10px; margin: 0; }
   .page-nav li {display: inline; margin: 0 10px 0 0; }
   .page-nav li a {border-bottom: 0;}
   
   /* ----------------------------- ARCHIVE ----------------------------- */
   
   .view-archive .entry-text ul {padding: 0; margin: 20px 0 20px 0; text-align: center; }
   .view-archive .entry-text li {font-size: 9px; margin-right; 10px; display: inline; }
   
   .view-archive table {width: 100%; text-align: center; margin: 0 0 20px 0; }
   .view-archive table caption a {font-size: 18px; font-weight: bold; text-transform: uppercase; letter-spacing: 3px; border-bottom: 0; }
   .view-archive table caption {padding: 0 0 20px 0;}
   
   /* ----------------------------- COMMENTS PAGE & REPLY ----------------------------- */
   
   .entry-linkbar {margin: -30px 0 20px 0; padding: 10px; }
   .entry-linkbar a { padding: 10px; }
   .entry-linkbar a:hover {opacity: .7; }
   
   .comment-wrap {margin: 0 0 20px 0; }
   
   .comment-head-in p {border-bottom: 1px dashed #444444; padding: 5px 0 5px 0; margin: 0; font-size: 9px; text-transform: uppercase;
   letter-spacing: 1px; color: #666666; }
   .comment-head-in p a {color: #999999; }
   .comment-head-in p + p a + a, .comment-head-in input + a {padding: 0 10px 0 10px; border-bottom: 0; }
   .comment-head-in p + p a + a:hover, .comment-head-in input + a:hover {opacity: .7; }
   .comment-head-in p a:hover {color: #666666; border-color: #666666; }
   
   .comment-head-in h3 {border-bottom: 1px solid #444444; padding: 0 0 20px 0; color: #ffffff; text-transform: uppercase; font-size: 18px;
   letter-spacing: 2px; margin-bottom: 0px; }
   
   .comment-upic {float: right; border: 10px solid #000000; }
   .comment-text {padding: 20px 0 10px 0; }
   .comment-menu {padding: 10px 0 10px 0; color: #666666; margin: 10px 0 0 0; border-top: 1px dashed #444444; }
   .comment-menu a {text-transform: uppercase; font-size: 9px; border: 0; letter-spacing: 1px;}
   
   .comments-links {text-align: center; margin-bottom: 20px; text-transform: uppercase; font-size: 9px; letter-spacing: 2px;}
   
   .screened {background: #000000; padding: 10px; }
   
   #subjectIconList table, #qrform table {border: 0 !important;}
   
   .ljcmtmanage { background: #000000; border: 1px dashed #444444; padding: 10px; }
   .ljcmtmanage span {font-size: 9px !important; letter-spacing: 2px; }
   
   /* ----------------------------- EXTRA ----------------------------- */
   
   .ljuser img {margin: 0; padding: 0;}
   .ljuser img:hover {opacity: .7;}
   .ljuser b {font-weight: normal; margin-left: 3px; text-transform: uppercase; font-size: 9px; }
   
   img[src*="btn_del.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*="pencil.gif"], img[src*="btn_edit.gif"],
   img[src*="anonymous.gif"] , img[src*="openid-profile.gif"], img[src*="none.gif"] , img[src*="help.gif"] , img[src*="btn_prev.gif"] ,
   img[src*="btn_edittags.gif"] , img[src*="btn_memories.gif"] , img[src*="btn_next.gif"], img[src*="userinfo.gif"] , img[src*="community.gif"],
   img[src*="newsinfo.gif"], img[src*="partnercomm.gif"], img[src*="sponcomm.gif"] , img[src*="syndicated.gif"] ,img[src*="icon_protected.gif"] ,
   img[src*="icon_private.gif"] , img[src*="icon_groups.gif"] , img[src*="btn_tellfriend.gif"] , img[src*="button-flag.gif"]
   {width: 0 !important; vertical-align: middle !important; margin: 0 auto; height: 0 !important;
   background: transparent url(http://i35.tinypic.com/1r7y1u.gif) no-repeat; }
   
   img[src*="btn_del.gif"] { padding: 10px 0 0 7px; background-position: 0px 0px;}
   img[src*="btn_scr.gif"] { padding: 8px 0 0 7px; background-position: 0px -24px;}
   img[src*="btn_unscr.gif"] { padding: 8px 0 0 7px; background-position: 0px -48px;}
   img[src*="btn_freeze.gif"] { padding: 8px 0 0 9px; background-position: 0px -72px;}
   img[src*="btn_unfreeze.gif"] { padding: 8px 0 0 9px; background-position: 0px -96px;}
   img[src*="btn_track.gif"] { padding: 8px 0 0 5px; background-position: -24px 0px;}
   img[src*="btn_tracking.gif"], img[src*="btn_tracking_thread.gif"]
   { padding: 8px 0 0 5px; background-position: -24px -24px;}
   img[src*="pencil.gif"], img[src*="btn_edit.gif"]
   { padding: 7px 0 0 7px; background-position: -24px -48px;}
   img[src*="anonymous.gif"] { padding: 8px 0 0 6px; background-position: -24px -72px;}
   img[src*="openid-profile.gif"] { padding: 6px 0 0 7px; background-position: -24px -96px;}
   img[src*="none.gif"] { padding: 6px 0 0 7px; background-position: -48px 0px;}
   img[src*="help.gif"] { padding: 8px 0 0 6px; background-position: -48px -24px;}
   img[src*="btn_prev.gif"] { padding: 5px 0 0 9px; background-position: -72px -24px;}
   img[src*="btn_edittags.gif"] { padding: 10px 0 0 16px; background-position: -72px -48px;}
   img[src*="btn_memories.gif"] { padding: 6px 0 0 12px; background-position: -72px -72px;}
   img[src*="btn_next.gif"] { padding: 5px 0 0 9px; background-position: -72px -96px;}
   img[src*="userinfo.gif"] { padding: 8px 0 0 6px; background-position: -108px 0px;}
   img[src*="community.gif"], img[src*="newsinfo.gif"], img[src*="partnercomm.gif"], img[src*="sponcomm.gif"]
   { padding: 8px 0 0 9px; background-position: -108px -24px;}
   img[src*="syndicated.gif"] { padding: 6px 0 0 6px; background-position: -108px -48px;}
   img[src*="icon_protected.gif"] { padding: 8px 0 0 6px; background-position: -108px -72px;}
   img[src*="icon_private.gif"] { padding: 8px 0 0 6px; background-position: -108px -96px;}
   img[src*="icon_groups.gif"] { padding: 8px 0 0 10px; background-position: -132px 0px;}
   img[src*="btn_tellfriend.gif"] { padding: 6px 0 0 10px; background-position: -132px -24px;}
   img[src*="button-flag.gif"] { padding: 9px 0 0 7px; background-position: -132px -48px;}
   
   #lj_controlstrip {display: none !important;}
   
   div.ContextualPopup div.Inner div.Content { font: 9px georgia !important; background: #000000; text-transform: uppercase; letter-spacing: 2px;
   padding: 5px; color: #999999 !important; width: 200px; line-height: 120% !important; }
   div.ContextualPopup div.Inner div.Content a { text-decoration: none !important; color: #ffffff !important; border-bottom: 1px dotted #999999;}
   div.ContextualPopup div.Inner div.Content a:hover { color: #999999 !important; }
   
   div.ContextualPopup div.Inner { background-color: transparent !important; border: 0; text-align: right;}
   div.ContextualPopup .Userpic {padding: 0;}
   div.ContextualPopup .Userpic img { margin: 0 -60px 0 0; padding: 10px; }
   

← Previous Step | 1 | 2 | 3 | Next Step →

( Install ) Step 3 - Link Back

Please link back to fruitstyle so others can find my layouts. Put either a button or the code in your Userinfo.
ButtonCode


View available buttonsLayout by fruitstyle
← Previous Step | 1 | 2 | 3 | Next Step →


( Optional ) Replace Colours

#ffffff#999999#666666#444444#1a1a1a#000000
How do I replace layout colours?

Replace Colours | Replace Images

( Optional ) Replace Images

Get all the images at Box.net

How do I replace layout images?

Replace Colours | Replace Images

Fruitstyle: Layouts and Winamp Skin Designs by Malionette