s2 flexible squares: shivers

[mrpimple]

live preview

installation.
-go to journal>journal style
-type in flexible squares in the search box, hit enter
-apply any of the themes in the result
-go to "customize your theme"
-click on css tab
-copy paste code into css box, make sure all drop down boxes above are set to "no" (IMPORTANT)
-hit save :-)

important notes.
you will have to set the nav links (entries, archive, friends, info) on your sidebar. you can do this in the links section of the journal customizer.

rules.
01. you may edit my layouts to your liking.
02. you may not use my layouts as a base for other themes.
03. please credit to appeuls if using any of my themes. you'll also find my future layout updates there.
04. enjoy!

code.
/* shivers by mrpimple@livejournal.com */

body {background-image: url('http://i42.tinypic.com/15phily.jpg'); background-attachment: fixed; background-color: #fcfcfc; text-align: center; color: #d8d8d8; font-family: "tahoma", sans-serif; font-size: 11px; margin: 10px 0 10px 0;}

#content {width: 650px; margin-left: auto; margin-right: auto;}

#maincontent {margin: 0px 210px 0px 0px; font-size: 11px; background-color: transparent; color: #d8d8d8; text-align: justify; margin-top: 50px;}

#sidebar {width: 150px; padding: 0px; float: right; text-align: left; background-color: transparent; font-size: 11px; font-family: "tahoma", sans-serif; color: #d8d8d8; line-height: 1.50;}

#header {display: none;}

#footer {width: auto; text-align: left; font-family: "consolas", sans-serif; font-size: 12px; font-weight: normal; letter-spacing: 0px; color: #d8d8d8; z-index: 100; clear: both;}

/* COLORS */

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

a, a:link, a:visited {color: #dbdbdb; text-decoration: none; -webkit-transition: 0.4s ease-in; font-family: "consolas" , sans-serif; text-transform: uppercase;}

a:hover {color: #f4f4f4; text-decoration: none; -webkit-transition: 0.5s ease-in;}

div#sidebar a, div#sidebar a:link, div#sidebar a:visited {color: #dbdbdb; -webkit-transition: 0.4s ease-in; font-family: "consolas", sans-serif; font-size: 11px;}

div#sidebar a:hover {color: #d8d8d8; -webkit-transition: 0.4s ease-in;}

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

/* SIDEBAR */

.defaultuserpic {text-align: center;}

.defaultuserpic img {height: 80px; width: 80px; border: 10px solid #f4f4f4; opacity: .7; filter: alpha(opacity=70); -webkit-transition: 0.4s ease-in;}

.defaultuserpic img:hover {opacity: 1; filter: alpha(opacity=100); -webkit-transition: 0.4s ease-in;}

.sbarheader {padding: 0px;}

.sbarbody {padding: 0px;}

.sbarbody2 {padding: 20px 0px 0px 0px}

table.calendar, .sbarcalendar, .sbarcalendarposts {display: none;}

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

li.sbaritem {padding: 0px 5px 0px 5px; list-style: none; background-color: #f4f4f4; -webkit-transition: 0.5s ease-in; margin-top: 3px; text-align: right;}

li.sbaritem:hover {background-color: #eeeeee; -webkit-transition: 0.5s ease-in;}

li.sbartitle { display: none;}

/* ENTRIES */

.subcontent {background-color: #ffffff; border: 1px solid #f4f4f4;}

.entry {margin: 0; padding: 10px; background-color: transparent; color: #d8d8d8; font-family: "tahoma", sans-serif; font-size: 11px; text-align: justify; line-height: 1.50;}

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

.entry_text { margin-bottom: 20px;}

.date {line-height: 100%; width: 150px; padding: 5px; margin: -10px 0; text-align: center; color: #dbdbdb; background-color: #f4f4f4; float: right; font-family: "consolas", sans-serif; font-size: 11px; text-transform: uppercase; }

.subject {font-weight: normal; padding: 20px 10px 10px 10px; color: #dbdbdb; font-family: "tahoma", sans-serif; font-size: 15px; text-transform: uppercase; border-bottom: 1px solid #f4f4f4;}

.datesubject { background-color: #ffffff; padding: 0; text-align: right;}

.userpic, .userpicfriends { position: relative; float: left; background-color: transparent !important; padding: 0px; margin: 0 0 0 -100px; z-index: 15; font-family: "consolas", sans-serif; font-size: 11px; text-align: center; }

.userpic img, .userpicfriends img { height: 80px; width: 80px; border: 11px solid #f4f4f4; opacity: .7; filter: alpha(opacity=70); -webkit-transition: 0.4s ease-in;}

.userpic img:hover, .userpicfriends img:hover {opacity: 1; filter: alpha(opacity=100); -webkit-transition: 0.5s ease-in;}

.userpic a font, .userpicfriends a font { color: #dbdbdb; text-align: center;}

.ljtags { margin-top: 20px; margin-bottom: -20px; text-transform: uppercase; font-family: "consolas", sans-serif; width: 150px; padding-left: 10px;}

.currents strong, .currentlocation strong, .currentmood strong, .currentgroups strong, .currentmusic strong {font-weight: normal;}

.currents, .currentmood, .currentmusic, .currentlocation, .currentgroups {text-transform: uppercase; font-family: "consolas", sans-serif; background-color: #f4f4f4; width: 150px; padding: 0px 10px 0px 5px;}

blockquote { font-size: 11px; padding: 7px; background-color: #f4f4f4; color: #d8d8d8; font-family: "consolas", sans-serif; line-height: 1.50;}

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

/* COMMENTS */

.comments {font-family: "tahoma", sans-serif; color: #ffffff; font-size: 0px; text-align: right; padding: 30px 0px 0px 0px; position: relative; text-transform: uppercase;}

div.comments a, div.comments a:link, div.comments a:visited {font-size: 12px; padding: 10px 5px 10px 5px; background-color: #f4f4f4; color: #dbdbdb; margin-right: 5px;}

div.comments a:hover {background-color: #eeeeee; -webkit-transition: 0.5s ease-in; text-decoration: none;}

/* COMMENT PAGES */

.datesubjectcomment {background-color: #ffffff; padding: 10px; margin: 0; text-transform: uppercase;}

.userpiccomment {position: relative; height: 80px; width: 80px; border: 10px solid #f4f4f4; left: 0px; margin: 10px 10px 0px 10px; z-index: 15; float: left;}

.box {padding: 0px; clear: left; border: none;}

input, textarea {background-color: #f4f4f4; border: 1px solid #eeeeee; color: #d8d8d8;}

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

.reply {position: relative; margin: 20px 20px 10px 20px; padding: 25px 10px 10px 10px; text-align: left; font-family: "tahoma", sans-serif; font-size: 11px; line-height: 125%; background-color: #ffffff; color: #d8d8d8;}

.replytosubject {font-weight: normal; min-height: 100px;}

.commentreply {position: relative; margin: 0px; font-size: 11px; font-family: "consolas", sans-serif; color: #d8d8d8; line-height: 1.50;}

.commentbox {padding: 10px; margin: 15px; background-color: #ffffff;}

.commentboxpartial {padding: 10px; margin: 15px; background-color: #ffffff;}

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

/* ARCHIVE PAGE */

ul.year {text-align: center; padding-bottom: 10px;}

ul.year li {display: inline;}

table.yeartable {margin-left: auto; margin-right: auto;}

table.yeartable td.yeardate, table.yeartable td.yearday {border: none; background-color: #f4f4f4; padding: 10px;}

table.yeartable td.yearday {background-color: #f4f4f4; padding: 10px;}

td.yearmonth {border: none;}

/* FOOTER */

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

ul.navfooter li { display: block; margin: 5px 0px 5px 0px;}

.clearfoot { clear: both;}

/* MISC */

form#qrform table { border: transparent !important;}

.clear { height: 0px;}

.skiplinks {text-align: left; padding-bottom: 10px;}

.separator {height: 50px;}

::-webkit-scrollbar-thumb:vertical { background-color: #dbdbdb; height: 20px;}

::-webkit-scrollbar { height: 30px; width: 6px; background-color: #ffffff;}

::selection { background: #f4f4f4;}

::-moz-selection { background: #f4f4f4;}

h2 { display: none;}

.ljtaglist { list-style-type: none; padding: 10px; background-color: #ffffff; margin-top: 0px; border: 1px solid #f4f4f4;}

/* TINYICONS */

img[src*="icon_protected.gif"], img[src*="icon_private.gif"], img[src*="icon_groups.gif"], .ljuser img[src*="syndicated.gif"], .ljuser img[src*="newsinfo.gif"], .ljuser img[src*="partnercomm.gif"], .ljuser img[src*="sponcomm.gif"] , img[src*="btn_del.gif"], img[src*="btn_edit.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*="anonymous.gif"], img[src*="openid-profile.gif"], img[src*="userinfo.gif"], img[src*="talk/none.gif"], img[src*="help.gif"], img[src*="pencil.gif"], img[src*="upgrade-paid-icon.gif"] {height: 0px; width: 0px; padding: 0 0 10px 10px !important; background: transparent none no-repeat scroll 0 0}

.subject img {vertical-align: middle !important; height: 0px; width: 0px; padding: 0 0 10px 10px !important; background: transparent none no-repeat scroll 0 0}
img[src*="icon_protected.gif"]{background-image: url(http://i33.tinypic.com/16k5b4m.jpg)}
img[src*="icon_private.gif"]{ height: 0px; width: 0px; padding: 0 0 10px 10px !important; background: transparent none no-repeat scroll 0 0; background-image: url(http://i34.tinypic.com/2ymyqfl.jpg)}
img[src*="icon_groups.gif"]{background-image: url(http://i36.tinypic.com/15cys7k.jpg)}

img[src*="btn_del.gif"]{background-image: url(http://i41.tinypic.com/16iwaqo.jpg)}
img[src*="btn_scr.gif"] {background-image: url(http://i44.tinypic.com/nx6t1t.jpg)}
img[src*="btn_unscr.gif"] {background-image: url(http://i44.tinypic.com/nx6t1t.jpg)}
img[src*="btn_freeze.gif"] {background-image: url(http://i43.tinypic.com/2u88qqe.jpg)}
img[src*="btn_unfreeze.gif"] {background-image: url(http://i43.tinypic.com/2u88qqe.jpg)}
img[src*="btn_track.gif"] {background-image: url(http://i43.tinypic.com/ix8o7b.jpg)}
img[src*="btn_tracking.gif"] {background-image: url(http://i43.tinypic.com/ix8o7b.jpg)}
img[src*="btn_tracking_thread.gif"] {background-image: url(http://i43.tinypic.com/ix8o7b.jpg)}
img[src*="pencil.gif"] {background-image: url(http://i40.tinypic.com/29g1u91.jpg)}
img[src*="btn_edit.gif"] {background-image: url(http://i40.tinypic.com/29g1u91.jpg)}

.ljuser img {width: 0; height: 0; background: transparent url(http://i43.tinypic.com/24v6z5c.jpg) no-repeat 0 0; padding: 16px 16px 0 2px !important; vertical-align: baseline !important}
.ljuser img[src*="userinfo.gif"] {background: transparent url(http://i43.tinypic.com/24v6z5c.jpg) no-repeat center left !important; padding: 16px 16px 0 2px !important}
.ljuser img[src*="community.gif"] { background: transparent url(http://i50.tinypic.com/2ylr5nb.jpg) no-repeat scroll 0 0 !important; padding: 16px 16px 0 2px !important}