S2 Flexible Squares : Lamb & Kitty
Click for a Live Preview.
( Get layout code & instructions )
( Layout Code ) #053 : Lamb & Kitty /* S2 FLEXIBLE SQUARES --- 053 Lamb & Kitty ---
Malionette @ Fruitstyle.livejournal.com
Do not remove this note. */
/* ---------- BODY ---------- */
body { font: 12px lucida grande, arial; color: #505050; margin: 0; padding: 0; background: #000000; }
a {color: #ff6590; text-decoration: none;}
a:hover {color: #f8b5c7; }
#content {background: #ffffff; width: 850px; margin: 0 auto; padding: 0;}
input, select, textarea, code { background: #dddddd; }
h1, h2, h3, h4, h5, h6 {font-family: georgia;}
blockquote {background: #dddddd; padding: 10px; font: 13px georgia; line-height: 150%; }
/* ---------- HEADER ---------- */
#header {background: #333333; margin-top: 6px; height: 40px; overflow: hidden;}
.navheader {padding: 0; margin: 0; float: right;}
.navheader li {list-style: none; display: inline; float: left; }
.navheader li a, .view { height: 40px; padding: 14px 6px 0 6px; color: #aaaaaa; font: 9px arial narrow; text-transform: uppercase; letter-spacing: 1px; display: block; }
.view {background: #505050; color: #ffffff; }
.navheader a:hover {color: #ff6590; background: #000000; }
.title {font: 12px courier new; color: #ffffff; text-transform: uppercase; padding: 13px 0 0 10px; letter-spacing: 2px; }
.subtitle {display: none;}
/* ---------- SIDEBAR ---------- */
#sidebar {background: #505050; padding: 10px 0 10px 0; min-height: 100px; }
#sidebar div, .sbartitle {display: none; }
#sidebar .sbarbody2, #sidebar #sidebar_linklist {display: block;}
.sbarlist {padding: 0px 0px 0px 20px; margin: 0; width: 100px; }
.sbarlist li {list-style: none; border-bottom: 1px dotted #333333; }
.sbarlist li a {font: 9px arial; display: block; padding: 5px 0 5px 0; color: #aaaaaa;}
.sbarlist li a:hover {color: #dddddd;}
.sbarbody2 {float: right; width: 700px; padding: 0 10px 0 0; font: 13px georgia; color: #aaaaaa; line-height: 200%;}
/* ---------- ENTRIES ---------- */
.userpic, .userpicfriends {float: left; padding: 20px 0 20px 20px; background: #ffffff !important; margin: 0 20px 0 0; width: 100px; text-align: center; color: #ffffff;}
.userpicfriends {font: 9px arial narrow; text-transform: uppercase; letter-spacing: 1px; padding-bottom: 10px; }
.userpicfriends img {padding: 0 0 10px 0;}
.userpicfriends a font {color: #ff6590; text-decoration: none;}
.userpicfriends a font:hover {color: #f8b5c7; }
.subcontent {border-top: 6px solid #000000; clear: both;}
.date {display: none;}
.subject {padding: 20px 0 10px 140px; font: 15px georgia; letter-spacing: 1px;}
.subject a {color: #000000; }
.subject a:hover {color: #aaaaaa; }
.subject img {padding: 0 10px 0 0; }
.entry { padding: 0px; margin: 0; background: #f8b5c7; }
.entry_text, .currents {margin-left: 120px; padding: 0 0 10px 20px; background: #ffffff; }
.ljtags {padding-top: 10px;}
.ljtags, .currents {font: 10px courier new; text-transform: uppercase; }
.currents strong {font-weight: lighter; color: #505050; }
.currents img {float: right; padding: 10px; }
.ljtags a, .currents { color: #aaaaaa; }
.ljtags a:hover {color: #808080; }
.comments {text-align: center; padding: 6px 0 6px 0; background: #ff6590; color: #f8b5c7; clear: both; }
.comments a {color: #ffffff; padding: 6px;}
.comments a:hover {color: #f8b5c7; }
.clear, .clearfoot, .separator {display: none;}
/* ---------- COMMENTS ---------- */
.skiplinks {text-align: center; padding: 6px 0 6px 0; background: #ff6590; color: #f8b5c7; clear: both;}
.skiplinks a {color: #ffffff; padding: 6px;}
.skiplinks a:hover {color: #f8b5c7; }
.lj-view-entry .box {background: #000000;}
.lj-view-entry .box center {border-top: 6px solid #000000; padding: 6px 0 6px 0; background: #333333; color: #dddddd;}
.commentbox , .commentboxpartial {background: #505050; margin: 6px 0 0 0; padding: 6px; color: #aaaaaa; font: 10px courier new; text-transform: uppercase; letter-spacing: 1px; clear: both;}
.commentbox .userpiccomment {float: left; margin: 0 10px 0 0; }
.datesubjectcomment strong { font: 15px georgia; letter-spacing: 1px;}
.commentreply {font: 12px arial; color: #ffffff; text-transform: none; letter-spacing: 0; padding-top: 10px;}
.commentbox > div[style*="margin-top"] {text-align: left !important; color: #ffffff; margin-top: 10px !important; }
.commentbox > div > div > a > img {width: 14px; height: 14px;}
.commentbox > div > div > a > img:hover {opacity: .7;}
.box + .box {padding-top: 10px; }
.box + .box center { margin-bottom: 0; padding-bottom: 0; }
.commentbox #qrform table {border: 0 !important; width: 100%; background: #333333; padding: 10px; margin: 23px -16px 6px 0; float: right;}
.commentbox #qrform td {text-align: left;}
/* ---------- REPLY ---------- */
.lj-view-reply .box {border-top: 6px solid #000000; background: #333333; color: #aaaaaa; padding: 15px 10px 10px 10px; }
.lj-view-reply #postform table, .box > div > div > #qrform table {border-top: 1px solid #505050; width: 100%; margin: 10px 0 0 0; padding: 10px 0 0 0; }
.lj-view-reply #postform td, .box > div > div > #qrform table td {text-align: left; line-height: 200%;}
.lj-view-reply #postform td > br {display: none;}
.lj-view-reply .entry {background: #ffffff;}
.box > div > div > #qrform table {background: #333333; color: #ffffff;}
.box > div > div > #qrform table > tbody > tr > td {padding: 0 0 0 10px;}
.box input, .box select, .box textarea {background: #505050; color: #ffffff; border: 0; padding: 1px 3px 1px 3px;}
.box input[type="submit"]:hover {background: #000000;}
/* ---------- ARCHIVE ---------- */
.year { padding: 0; margin: 0; text-transform: uppercase; padding: 6px 0 6px 0; background: #ff6590; color: #f8b5c7; text-align: center; border-bottom: 6px solid #000000; }
.year li {display: inline; }
.year a {color: #ffffff; padding: 6px;}
.year a:hover {color: #f8b5c7; }
.yeartable {padding: 10px 0 0 0;}
.yearmonth { font: 15px georgia; letter-spacing: 1px; padding: 0 0 10px 0;}
.yearmonth a {font: 12px arial; letter-spacing: 0;}
.subcontent + div + div + div + .skiplinks {border-top: 6px solid #000000;}
.lj-view-month .entry {background: #ffffff; padding: 0 10px 10px 10px;}
.lj-view-month .entry dt {font: 15px georgia; letter-spacing: 1px; font-weight: lighter; }
/* ---------- TAG ---------- */
.lj-view-tags #maincontent {border-top: 6px solid #000000; padding: 0 10px 10px 10px; }
.lj-view-tags #maincontent > h2 {font: 15px georgia; letter-spacing: 1px; font-weight: lighter; padding: 10px;}
.lj-view-tags .ljtaglist li {list-style-type: decimal-leading-zero; display: inline-block; width: 33%; padding: 6px 1px 6px 1px; }
/* ---------- FOOTER ---------- */
#footer {background: #333333; border-top: 6px solid #000000; height: 40px; overflow: hidden; }
.navfooter {padding: 0; margin: 0;}
.navfooter li {list-style: none; display: inline; float: left; }
.navfooter li a, .viewing { height: 40px; padding: 14px 5px 0 5px; color: #aaaaaa; font: 9px arial narrow; text-transform: uppercase; letter-spacing: 1px; display: block; }
.viewing {background: #000000; color: #ffffff; }
.navfooter a:hover {color: #ff6590;}
/* ---------- OTHER BELOW HERE ---------- */
::-moz-selection, ::selection, code::-moz-selection, code::selection { background: #ff6590; color: #ffffff;}
div.ContextualPopup div.Inner {border: 0; background: transparent !important; font: 10px arial !important; }
div.ContextualPopup div.Userpic {margin-right: -30px; padding: 10px; background: #f8b5c7; }
div.ContextualPopup div.Content { background: #333333; padding: 5px; color: #aaaaaa; }
div.ContextualPopup div.Inner div.Content a {color: #ffffff !important; text-decoration: none !important;font-weight: lighter !important; }
div.ContextualPopup div.Inner div.Content span.alias-unavailable a {color: #ffffff !important}
div.ContextualPopup div.Inner div.Content a:hover,
div.ContextualPopup div.Inner div.Content .alias-unavailable a:hover {color: #f8b5c7 !important;}
/* Generated by Malionette's Tiny Icon Generator */
img[src*="img/userinfo.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(http://img828.imageshack.us/img828/5647/user1z.png) no-repeat !important; padding: 16px 0 0 16px !important; }
img[src*="img/community.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(http://img24.imageshack.us/img24/3274/home1p.png) no-repeat !important; padding: 16px 0 0 16px !important; }
img[src*="img/icon_protected.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(http://img6.imageshack.us/img6/9430/heart1f.png) no-repeat !important; padding: 16px 0 0 16px !important; margin-bottom: -5px; }
img[src*="img/icon_private.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(http://img16.imageshack.us/img16/2691/close1.png) no-repeat !important; padding: 16px 0 0 16px !important; margin-bottom: -5px; }
body > div {background-color: #000000 !important; border: 0 !important;}
.headerimage {background: url(http://img841.imageshack.us/img841/1331/110715heart.jpg) no-repeat top center; height: 159px;}
More LJ layout stylesheets and profile codes at fruitstyle.