layout 005; black, dangling carrots (flexible squares)

Jan 19, 2009 00:33

• Please Comment & Credit (profoundly_grey)
• No Hotlinking/Stealing/Claiming as Your Own



Live Preview | Image Preview


Title: Black, Dangling Carrots
Theme: S2 Flexible Squares
Made by: profoundly-grey.livejournal.com
Tested in: Firefox & IE, Paid & Plus
Customized Comment Pages? Yes (Paid & Plus Only)
Modifications? Sure, as long as I'm still credited for the coding of course! : )
Tiny Icons: FamFamFam, passing_girl & graphicsbyjulz

01. Go to customize, set style to S2 and save changes.
02. Select Flexible Squares as your new theme.
03. Click on custom options then click on Custom CSS, set all three drop-down menus to NO and paste CSS into the custom stylesheet textarea.
05. Also, if you wish to use the customized comment pages, make sure to have it enabled. It can be found under the Display option in your customization area.
06. Save changes, and you're finished!
07. To add a header, put in vital information and replace the .headerimage coding with this:

.headerimage {
position: relative;
margin: 0 auto 0 auto;
width: 000px;
height: 000px;
background: url();
}

CSS:

/*----------
Title: Black Dangling Carrots
Theme: S2 Flexible Squares
Tested: Firefox & Internet Explorer, Paid & Plus
Coding & Background Pattern: http://profoundly-grey.livejournal.com/
Tiny Icons: http://famfamfam.com | http://passing-girl.livejournal.com | http://community.livejournal.com/graphicsbyjulz
----------*/

body {
margin: 20px 0 20px 0;
background-color: #000000;
background-image: url(http://i18.photobucket.com/albums/b149/lycanthropist/patterns/015.png);
background-attachment: fixed;
text-align: left;
color: #F8FFDB;
font-family: "Arial", sans-serif;
font-size: 8pt;
}

a, a:link, a:visited {
color: #FF8111;
text-decoration: none;
}

a:hover {
color: #FFD736;
}

p, td {
font-size: 8pt;
}

blockquote {
padding: 25px;
text-align: justify;
font-size: 8pt;
border-right: 10px solid #BED500;
}

blockquote:hover {
border-right: 10px solid #FF8111;
}

code, kbd, pre, tt {
font-family: monospace;
}

/*---------- General Page Alignment & Width ----------*/

#content {
width: 70%;
margin: 0 auto 0 auto;
}

#maincontent {
margin: 0 235px 0 0;
}

#sidebar {
padding: 15px;
background-color: #222222;
width: 200px;
float: right;
}

#qrform table {
border: 0 !important;
}

/*---------- Header & Footer ----------*/

#header, #footer {
width: 100%;
margin-left: -5px;
text-align: right;
text-transform: lowercase;
font-family: times new roman;
font-style: italic;
font-size: 19pt;
letter-spacing: 0px;
}

.headerimage {
/*header not recommended*/
}

div#header a, div#header a:link, div#header a:visited {
padding: 5px 5px 0 5px;
color: #FF8111;
}

div#header a:hover, div#header li.view {
padding: 5px 5px 0 5px;
color: #FFD736;
}

div#footer a, div#footer a:link, div#footer a:visited {
color: #FF8111;
}

div#footer a:hover {
color: #FFD736;
}

div#footer li.viewing {
display: none;
}

.title, .subtitle {
display: none;
}

ul.navheader, ul.navfooter {
padding: 0px;
margin: 0px;
}

ul.navheader li, ul.navfooter li {
display: inline;
padding: 5px;
}

.clearfoot {
clear: both;
}

/*---------- Recent Entries ----------*/

.subcontent {
background-color: #222222;
}

.entry {
margin: 10px 10px 10px 95px;
padding: 0 25px 50px 25px;
background-color: #222222;
}

.userpic, .userpicfriends {
position: relative;
float: left;
margin: 55px 0 0 10px;
background-color: #222222 !important;
color: #333 !important;
text-align: center;
z-index: 15;
}

.userpicfriends a font {
color: #666;
}

.date {
color: #000;
font-family: "Arial", sans-serif;
font-size: 7pt;
}

.subject {
color: #BED500;
text-transform: lowercase;
font-family: times new roman;
font-style: italic;
font-size: 14pt;
}

.subject a, .subject a:link, .subject a:visited {
color: #FF8111;
}

.subject a:hover {
color: #FFD736;
}

.datesubject {
background-color: #333;
padding: 5px;
text-align: right;
border-bottom: 1px dashed #000;
}

.entry ul li, .entry ol li {
padding-left: 5px;
margin-left: 15px;
}

.ljtags {
position: relative;
text-transform: lowercase;
font-size: 7pt;
font-weight: lighter;
top: 30px;
}

.ljtags a, .ljtags a:link, .ljtags a:visited {
color: #FFD736;
}

.ljtags a:hover {
color: #BED500;
}

.currents, .currentmood, .currentmusic, .currenttags {
text-transform: lowercase;
font-size: 7pt;
}

.currents strong {
font-weight: lighter;
}

.comments {
position: relative;
top: 20px;
text-align: right;
text-transform: uppercase;
font-size: 9pt;
color: #222222;
letter-spacing: 0px;
}

div.comments a, div.comments a:link, div.comments a:visited {
color: #BED500;
}

div.comments a:hover {
color: #FF8111;
}

.separator {
height: 0px;
}

/*---------- Sidebar ----------*/

.defaultuserpic {
text-align: center;
}

.sbarbody {
padding: 5px;
}

.sbarbody2 {
padding: 5px;
}

div#sidebar a, div#sidebar a:link, div#sidebar a:visited {
color: #FF8111;
display: block;
}

div#sidebar a:hover {
color: #FFD736;
background-color: #333;
}

table.calendar {
margin: 0 auto 0 auto;
}

.sbarcalendar {
padding: 6px;
text-align: center;
font-family: "Arial", sans-serif;
font-size: 7pt;
border: 1px solid #333;
}

.sbarcalendarposts {
padding: 6px;
background-color: #222222;
text-align: center;
font-family: "Arial", sans-serif;
font-size: 7pt;
border: 1px solid #BED500;
}

ul.sbarlist {
padding-left: 0px;
margin-left: 0px;
list-style: none;
}

li.sbaritem {
display: block;
padding: 2px 0 2px 0;
list-style: none;
border-bottom: 1px solid #333;
}

li.sbartitle {
padding: 10px;
background-color: #333;
text-align: center;
text-transform: lowercase;
font-family: times new roman;
font-style: italic;
font-size: 12pt;
color: #BED500;
}

/*---------- Tags Page ----------*/

.ljtaglist {
width: 50%;
margin: 0 0 0 150px;
color: #444;
}

.ljtaglist a, .ljtaglist a:link, .ljtaglist a:visited {
color: #BED500;
}

.ljtaglist a:hover {
color: #FFD736;
}

.ljtaglist li {
list-style-type: decimal-leading-zero;
padding: 3px 0 3px 0;
}

h2 {
margin: 0 0 0 25px;
text-transform: lowercase;
font-family: times new roman;
font-size: 16pt;
font-style: italic;
font-weight: lighter;
color: #444;
}

/*---------- Archive ----------*/

ul.year {
text-align: center;
font-family: times new roman;
font-size: 16pt;
font-style: italic;
padding: 20px;
}

ul.year li {
display: inline;
}

table.yeartable {
margin: 0 auto 0 auto;
}

table.yeartable td.yeardate, table.yeartable td.yearday {
padding: 10px;
}

table.yeartable td.yearday {
padding: 25px 10px 25px 10px;
background-color: #111;
text-align: center;
border: none;
}

td.yearmonth {
font-family: "times new roman", sans-serif;
font-size: 11pt;
font-style: italic;
}

/*---------- COMMENT PAGES ----------*/

.datesubjectcomment {
margin: 5px 0 0 0;
padding: 5px;
background-color: #333;
}

.userpiccomment {
top: -20px;
left: -5px;
width: 50px;
height: 50px;
float: left;
position: relative;
margin: 10px;
z-index: 15;
}

.box {
clear: left;
}

input, textarea {
padding: 10px;
background-color: #222;
color: #FFF;
font-family: "arial", sans-serif;
font-size: 8pt;
line-height: 125%;
border: 1px solid #333;
}

textarea.textbox {
width: 100% !important;
}

.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
background-color: #222;
color: #FFF;
font-family: "arial", sans-serif;
font-size: 8pt;
text-align: left;
line-height: 125%;
}

.replytosubject {
font-weight: bold;
}

.commentreply {
position: relative;
margin: 10px;
color: #FFF;
font-family: "arial", sans-serif;
font-size: 8pt;
}

.commentbox, .commentboxpartial {
margin: 10px 0 10px 10px;
padding: 25px;
background-color: #222;
}

.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #FFF;
}

.datesubjectcomment a:hover {
color: #FFD736;
}

.commentinfo {
width: 100%;
margin: 10px 0 0 0;
background-color: #222;
}

.skiplinks {
text-align: center;
font-size: 9pt;
}

/*---------- Tiny Icons ----------*/

.ljuser img {
width: 0; height: 0;
background-repeat: no-repeat;
background-color: transparent;
background-image: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/user_icon_yellow.gif);
padding: 12px 8px 0 1px !important;
}

.subject img[src="http://p-stat.livejournal.com/img/icon_protected.gif"] {
width: 0; height: 0;
padding: 0 16px 16px 0;
background: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/emblemreadonlyze3.png);
}

.subject img[src="http://p-stat.livejournal.com/img/icon_private.gif"] {
width: 0; height: 0;
padding: 0 16px 16px 0;
background: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/key.png);
}

.subject img[src="http://p-stat.livejournal.com/img/icon_groups.gif"] {
width: 0; height: 0;
padding: 0 16px 16px 0;
background: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/heart.png);
}

.ljuser img[src="http://p-stat.livejournal.com/img/userinfo.gif"] {
background-color: transparent;
background-image: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/user_icon_yellow.gif);
padding: 12px 8px 0 1px !important;
}

.ljuser img[src="http://p-stat.livejournal.com/img/community.gif"] {
background-color: transparent;
background-image: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/bullet_star.png);
padding: 16px 16px 0 1px !important;
}

.ljcmt, .commentbox img[src="http://p-stat.livejournal.com/img/btn_del.gif"] {
width: 0; height: 0;
padding: 0 12px 12px 0;
background: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/delete.png);
}

.ljcmt, .commentbox img[src="http://p-stat.livejournal.com/img/btn_scr.gif"] {
width: 0; height: 0;
padding: 0 12px 12px 0;
background: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/screen-1.png);
}

.ljcmt, .commentbox img[src="http://p-stat.livejournal.com/img/btn_unscr.gif"] {
width: 0; height: 0;
padding: 0 12px 12px 0;
background: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/unfreezeorunscreen.png);
}

.ljcmt, .commentbox img[src="http://p-stat.livejournal.com/img/btn_freeze.gif"] {
width: 0; height: 0;
padding: 0 12px 12px 0;
background: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/freeze-1.png);
}

.ljcmt, .commentbox img[src="http://p-stat.livejournal.com/img/btn_unfreeze.gif"] {
width: 0; height: 0;
padding: 0 12px 12px 0;
background: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/unfreezeorunscreen.png);
}

.ljcmt, .commentbox img[src="http://p-stat.livejournal.com/img/btn_track.gif"] {
width: 0; height: 0;
padding: 0 12px 12px 0;
background: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/track-1-1.gif);
}

.ljcmt, .commentbox img[src="http://p-stat.livejournal.com/img/btn_tracking.gif"] {
width: 0; height: 0;
padding: 0 12px 12px 0;
background: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/untrack-1.gif);
}

.ljcmt, .commentbox img[src="http://p-stat.livejournal.com/img/btn_edit.gif"] {
width: 0; height: 0;
padding: 0 12px 12px 0;
background: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/edit-1.png);
}

.box img[src="http://p-stat.livejournal.com/img/anonymous.gif"] {
width: 0; height: 0;
padding: 0 16px 16px 0;
background: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/bullet_star.png);
}

.box img[src="http://p-stat.livejournal.com/img/openid-profile.gif"] {
width: 0; height: 0;
padding: 0 16px 16px 0;
background: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/bullet_star.png);
}

.box img[src="http://p-stat.livejournal.com/img/help.gif"] {
width: 0; height: 0;
padding: 0 16px 16px 0;
background: url(http://i18.photobucket.com/albums/b149/lycanthropist/Layout/bullet_star.png);
}

/*---------- Contextual Popup ----------*/

div.ContextualPopup {
margin: 5px 0 0 30px;
font: normal 7pt "Arial", "Arial", sans-serif !important;
}

div.ContextualPopup div.Inner {
background-color: #333 !important;
color: #000 !important;
border: none;
padding: 2px;
width: 300px;
}

div.ContextualPopup .Content {
background: #333;
padding: 4px;
margin: 4px 59px 4px 4px;
}

div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
text-decoration: none !important;
color: #FF8111 !important;
}

div.ContextualPopup div.Inner a:hover {
color: #FFD736 !important;
}

div.ContextualPopup .Relation {
text-transform: uppercase;
color: #BED500;
font-size: 7pt;
letter-spacing: 0px;
border-bottom: 1px dashed #222;
padding: 0 0 2px 0;
margin: 0 0 2px 0;
}

/*---------- Miscellaneous ----------*/

.clear {
height: 15px;
}

Like what you see? Join profoundicons!

layouts: flexible squares, ! layouts, layouts: s2

Previous post Next post
Up