[Layout] Hey! Say! Jump: Yabu Kota

[greenberryhair]

Style: S2 Flexible Squares
Screen Resolution: 800x600 and higher
Browser Compatible: Firefox, IE, & Safari
Header Compatible: Yes
Nav Bar Compatible: Yes
Plus Account/Ads: Yes
Base Layout: snubbly

Requested by: pretty_yabu

Preview



Note: I test my layouts on a plus account to show what it would look like with ads under the header or navigation menu.

1. Choose Journal Style: Under Select a New Theme type Flexible Squares in the search box, and apply any one of those themes, except the 'Circular' ones.

2. Sidebar: Your default userpic, blurb, link list and tags can appear. Calendar & page summary are disabled.

3. Custom CSS: Set all 3 dropdown boxes to No, copy & paste the code into the Custom stylesheet textbox and select Save Changes:

/*----------------------------------------------------------------------------------------------
S2 FLEXIBLE SQUARES
Layout by Cindie-chan @ http://greenberryhair.livejournal.com
for Cheverloo @ http://cheverloo.livejournal.com
Base Layout by snubbly @ http://snubbly.livejournal.com
Background by: Naked & Angry @ http://www.nakedandangry.com
-----------------------------------------------------------------------------------------------*/
body {background: #4D526A url(http://i35.tinypic.com/2cdd45s.jpg) fixed;
text-align: center; color: #070c0b; font-family: trebuchet ms, sans-serif; font-size: 11px; margin-top: 20px;}
::-moz-selection {color: #070c0b; background: #FFFFFF;}

a, a:link, a:visited {color: #4D526A; text-decoration: none;}
a:hover {color: #070c0b; border-bottom: 1px dotted #070c0b; text-decoartion: none;}

.clearfoot {clear: both; height: 0;}
.title, .subtitle, .clear, #sidebar_calendar, #sidebar_summary {display: none;}

/*----------------------------------------------------------------------------------------------
PAGE SET-UP
-----------------------------------------------------------------------------------------------*/
#content {width: 600px; text-align: justify; margin: auto;}
#maincontent {clear: both; margin-top: 20px;}
#sidebar {background: #FAFAFA; border: 10px solid #868686; width: auto; padding: 5px; text-align: justify;}
#footer, #header {font-family: arial; font-size: 7.5pt; letter-spacing: 1px; text-transform: uppercase; text-align: center; background: #FAFAFA; border: 10px solid #868686; color: #999; padding: 10px 5px; margin-bottom: 20px;}
ul.navheader li, ul.navfooter li {display: inline; padding: 0 10px;}
ul.navheader, ul.navfooter {padding: 0; margin: 0;}
#header a, #footer a {color: #4D526A;}
#header a:hover {color: #070c0b;}
#footer a:hover {color: #070c0b;}

/*----------------------------------------------------------------------------------------------
SIDEBAR
-----------------------------------------------------------------------------------------------*/
.defaultuserpic a:hover {border: 0}
.defaultuserpic {position: relative; float: left; background: #868686; border: 0; padding: 5px; margin: 0 5px 5px 0;}

#sidebar_tags {clear: both;}
#sidebar_linklist {margin-bottom: 10px;}
#sidebar_linklist a {background: url(http://i147.photobucket.com/albums/r304/snubicons/layouts/greyarrow.gif) center left no-repeat; padding-left: 12px; margin-right: 5px}
.tagcloud span {font-size: 11px !important; margin-right: 5px;}
li.tagcloud {list-style: none;}
#sidebar_tags a {background: url(http://i147.photobucket.com/albums/r304/snubicons/layouts/greyarrow.gif) center left no-repeat; padding-left: 12px; margin-right: 5px}

ul.sbarlist {padding: 0; margin: 0;}
.sbartitle, .sbarbody {padding: 0;}
li.sbaritem {margin-right: 5px; display: inline;}
.sbarbody2 {padding: 0; margin-bottom: 10px;}
li.sbartitle {padding: 0; margin-bottom: 5px; color: #868686; font-family: arial; font-size: 7.5pt; letter-spacing: 1px; text-transform: uppercase; font-weight: bold; list-style: none;}

/*----------------------------------------------------------------------------------------------
ENTRIES
-----------------------------------------------------------------------------------------------*/
.entry ul li, .entry ol li {padding-left: 5px; margin-left: 10px;}
.subcontent {background: #FAFAFA; border: 10px solid #868686; padding: 5px;}
.separator {height: 20px;}

h2 {padding-left: 20px;}
.date {text-align: right; color: #999; border-bottom: 1px dotted #999; padding-bottom: 5px;}
.datesubject {font-family: arial; font-size: 7.5pt; letter-spacing: 1px; text-transform: uppercase; font-weight: bold; margin: 10px 0;}
.subject {color: #868686; font-weight: bold; margin-top: 10px;}

.entry {margin-top: 10px;}
.entry_text {margin-top: 10px;}
.entry_text img {max-width: 420px; overflow: hidden;}

.comments {font-family: arial; font-size: 7.5pt; letter-spacing: 1px; text-align: right; clear: both; margin: 10px 0; padding-top: 10px; border-top: 1px dotted #999;}
.comments a {color: #4D526A; text-transform: uppercase;}
.comments a:hover {color: #070c0b; border-bottom: 1px dotted #070c0b;}

.currents {text-align: left; text-transform: lowercase; color: #999; font-size: 7.5pt; margin-top: 5px;}
.ljtags {font-weight: bold; text-transform: lowercase; margin-top: 10px; color: #999; font-size: 7.5pt;}
.ljtags a {font-weight: normal;}
li {list-style-type: square; list-style-image: url(http://i147.photobucket.com/albums/r304/snubicons/layouts/greyarrow.gif);}

.userpic, .userpicfriends {position: relative; float: left; background: #868686 !important; border: 0; text-align: center; padding: 5px; margin: 0 5px 5px 0;}
.userpicfriends font {font-family: trebuchet ms; font-size: 11px; color: #777;}

/*----------------------------------------------------------------------------------------------
TAGS PAGE
-----------------------------------------------------------------------------------------------*/
ul.ljtaglist {background: #FAFAFA; border: 10px solid #868686; margin: 0; padding: 5px 5px 5px 25px;}
h2 {background: #FAFAFA; border: 10px solid #868686; color: #949E40; font-family: arial; font-size: 7.5pt; letter-spacing: 1px; text-transform: uppercase; padding: 5px; font-weight: normal; margin-bottom: 20px; display: none;}

/*----------------------------------------------------------------------------------------------
CALENDAR PAGE
-----------------------------------------------------------------------------------------------*/
ul.year li {display: inline; padding: 0 10px;}
ul.year {text-align: center; background: #FAFAFA; border: 10px solid #868686; padding: 10px 5px; font-family: arial; font-size: 7.5pt; letter-spacing: 1px; margin: 0 0 20px 0;}
table.yeartable {margin: auto; text-align: center; background: #FAFAFA; border: 10px solid #868686; padding: 4px; width: 100%;}
table.yeartable td.yeardate, table.yeartable td.yearday {background: #FFF; border: 0;}
table.yeartable td.yearday {text-align: center; background: #FFF; border: 0;}
td.yearmonth {border: 0;}

input, textarea, select, option, button {font-family: trebuchet ms, sans-serif; font-size: 11px; color: #777; background: #FAFAFA; border: 1px solid #868686;}

/*----------------------------------------------------------------------------------------------
COMMENTS PAGE [ paid/plus accounts ]
-----------------------------------------------------------------------------------------------*/
.skiplinks {text-align: center; margin-bottom: 20px; background: #FAFAFA; border: 10px solid #868686; padding: 10px 5px; font-family: arial; font-size: 7.5pt; letter-spacing: 1px; text-transform: uppercase;}
#postform img {display: none;}
.box {clear: none !important; background: #FAFAFA; border: 10px solid #868686; padding: 5px; margin-bottom: 20px;}
textarea.textbox {width: 95% !important;}
.datesubjectcomment {background: #F5F5F5; color: #777; padding: 5px; margin-top: 40px;}
.userpiccomment {position: relative; top: -30px; left: 0; border: 5px solid #868686; background: #F5F5F5; padding: 5px; margin: 10px 10px -20px 10px; z-index: 15; float: left;}
.reply {position: relative; margin: 20px 30px 10px 30px; padding: 25px 10px 10px 10px; text-align: justify; background: #FFF; color: #777;}
.commentreply {position: relative; margin: 10px; font-size: 11px; font-family: trebuchet ms, sans-serif; color: #777;}
.commentbox {margin: 10px; background: #FFF;}
.commentboxpartial {margin: 10px; background: #FFF;}
.commentinfo {background: #FFF; margin-top: 10px; width: 100%;}
.replytosubject {font-weight: bold;}

/*---------------------------------------------------------------------------------------------
TINY ICONS [ http://famfamfam.com ]
-----------------------------------------------------------------------------------------------*/
img[src*="icon_protected.gif"]{width: 0; height: 0; padding: 16px 16px 0 0 !important; background: url(http://i147.photobucket.com/albums/r304/snubicons/layouts/locked.png);}
img[src*="icon_private.gif"]{width: 0; height: 0; padding: 16px 16px 0 0 !important; background: url(http://i147.photobucket.com/albums/r304/snubicons/layouts/private.png);}
img[src*="icon_groups.gif"]{width: 0; height: 0; padding: 16px 16px 0 0 !important; background: url(http://i147.photobucket.com/albums/r304/snubicons/layouts/groupcustom.png);}

img[src*="btn_edit.gif"]{width: 0; height: 0; padding: 16px 16px 0 0 !important; background: url(http://i147.photobucket.com/albums/r304/snubicons/layouts/pencil.png);}
img[src*="btn_del.gif"]{width: 0; height: 0; padding: 16px 16px 0 0 !important; background: url(http://i147.photobucket.com/albums/r304/snubicons/layouts/delete.png);}
img[src*="btn_scr.gif"]{width: 0; height: 0; padding: 16px 16px 0 0 !important; background: url(http://i147.photobucket.com/albums/r304/snubicons/layouts/locked.png);}
img[src*="btn_unscr.gif"]{width: 0; height: 0; padding: 16px 16px 0 0 !important; background: url(http://i147.photobucket.com/albums/r304/snubicons/layouts/public.png);}
img[src*="btn_freeze.gif"], img[src*="btn_unfreeze.gif"], img[src*="btn_track.gif"], img[src*="btn_tracking.gif"]{display: none;}

img[src*="userinfo.gif"] {width: 0; height: 0; padding: 16px 16px 0 0 !important; background-repeat: no-repeat;
background-image: url(http://i147.photobucket.com/albums/r304/snubicons/layouts/user.png) !important;}
img[src*="community.gif"] {width:0; height: 0; padding: 16px 16px 0 0 !important; background-repeat: no-repeat;
background-image: url(http://i147.photobucket.com/albums/r304/snubicons/layouts/group.png) !important;}

/*----------------------------------------------------------------------------------------------
ADD HEADER IMAGE [ edit the width, height and header url ]
-----------------------------------------------------------------------------------------------*/
.headerimage {position: relative; margin: auto; width: 600px; height: 400px;
background: url(http://i34.tinypic.com/flj339.jpg) no-repeat;}

Artist Notes:

OK, I'm excited because this layout set my new record on making layouts. My record is 45 minutes from start to finish! YAY! Once I was able to sit down and start it, it went by really quick! I really like it because it's so neutral and I'm hoping pretty_yabu likes it as well!

Credit me: greenberryhair, shindii_ruiizu, or cheverloo.
Comments and/or notes = ♥!
Requests are accepted through Cheverloo's request post, in my request post @ greenberryhair, or through shindii-ruiizu@dA.