Melon

[punch]

I'm back again, two layouts in one week, wow.

S2 flexible squares, crazy hover features and opacity, weird colours, but I like it.

Designed from THIS colour palette.

Live preview / download css

CSS:
/* flexible squares // punch @ novoluxa*/ /* body */ body { background: #D1F2A5; text-align: center; color: #888888; font-family: trebuchet ms; font-size: 11px; margin: 20px 0 20px 0; } a, a:link, a:visited { color: #FFC48C; text-decoration: none !important; } b, strong { color: #FF9F80; letter-spacing: 0px; font: bold 9px georgia; } i, em { font-style: italic; font-family: georgia; color: #FF9F80; letter-spacing: 1px; } u, ul { color:#FF9F80; letter-spacing: 1px; } p { background-color: transparent; font-family: arial; padding: 0px; } blockquote { background: url(); font-size: 10px; padding: 3px; font-family: tahoma; letter-spacing: 0px; border-left: 5px solid #D1F2A5; text-transform: uppercase; margin-top: 3px; margin-left: 20px width: 250px; line-height: 11px; text-align: justify; } code, kbd, pre, tt { font-family: monospace; } #content { width: 500px; margin-right: auto; margin-left: auto; margin-bottom: auto; background-color: transparent; border-width: 0px; border-style: solid; border-color: #999999; padding: 15px; margin-top: 30px; } #maincontent { font-family: "arial", sans-serif; font-size: 8pt; background: transparent; color: #888888; border: 0px; text-align: left; margin-right: auto; margin-left: auto; } #sidebar { background: transparent; padding: 5px; width: 200px; float: left; margin-left: -200px; margin-top: 32px; color: #; text-align: justify; } #header { display: none; } #footer { width: 500px; padding: 5px; margin: 0px; text-align: center; font-family: lucida console; font-size: 10px; font-weight: normal; letter-spacing: 5px; border-width: 0px; background: transparent; color: #FFFFFF!important; z-index: 100; clear: both; text-transform: uppercase; -moz-opacity:0.3; -khtml-opacity: 0.3; opacity: 0.3; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } #footer:hover { -moz-opacity:0.3; -khtml-opacity: 0.3; opacity: 0.3; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } /* header -- links to views; title of journal; subtitle of journal */ ul.navheader { padding: 0px; margin: 0px; } ul.navheader li { display:inline; padding: 0 10px 0 0px; } .title, .subtitle { display:none; } /* sidebar */ .defaultuserpic { display: none; } .defaultuserpic img { display: none; } .sbarheader { padding: 0px; } .sbarbody { padding: 0px; } .sbarbody2 { text-transform: none; padding: 10px; border: 0px solid #FFC48C; background: #EFFAB4; color: #666666; font-size: 10px; font-weight: bold; font-family: trebuchet ms; margin-top: 10px; letter-spacing: 0px; -moz-opacity:0.3; -khtml-opacity: 0.3; opacity: 0.3; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .sbarbody2:hover { text-transform: none; padding: 10px; border: 0px solid #FFC48C; background: #EFFAB4; color: #666666; font-size: 10px; font-weight: bold; font-family: trebuchet ms; margin-top: 10px; letter-spacing: 0px; -moz-opacity:0.9; -khtml-opacity: 0.9; opacity: 0.9; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } table.calendar { display:none; } .sbarcalendar { display:none; } .sbarcalendarposts { display:none; } ul.sbarlist{ list-style: none; margin-left: -40px; } li.sbaritem{ width: 190px; color: #FFFFFF; text-align: left; background: #EFFAB4; padding-left: 5px; border-left: 5px solid #FFC48C; letter-spacing: -1px; font-size: 9px; font-family: tahoma; text-transform: uppercase; text-decoration: none!important; margin-top: 3px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } li.sbaritem:hover{ width: 190px; color: #FFFFFF; text-align: left; padding-left: 5px; background: #EFFAB4; border-left: 10px solid #D1F2A5; letter-spacing: -1px; font-size: 9px; font-family: tahoma; text-transform: uppercase; text-decoration: none!important; margin-top: 3px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } li.sbartitle{ padding-left: 0px; margin-left: 0px; display: none; } /* maincontent */ .subcontent { background: transparent; padding: 20px; } .entry { background-color: #EFFAB4; color: #666666; font-family: trebuchet ms; font-size: 11px; text-align: justify; border: 0px; padding: 20px; margin-top: 6px; } .entry img { max-width: 250px; } .entry ul li { padding-left: 5px; margin-left: 15px; } .entry ol li { padding-left: 5px; margin-left: 15px; } .userpic { display: none; } .userpicfriends { float: right; margin-top: 27px; margin-right: -125px; color: #EFFAB4!important; background: transparent!important; -moz-opacity:0.3; -khtml-opacity: 0.3; opacity: 0.3; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .userpicfriends font, .userpic font { color: transparent; text-transform: uppercase; font-size: 10px; font-family: arial; } .userpicfriends img, .userpic img { background: #EFFAB4!important; border: #EFFAB4 5px solid; -moz-opacity:0.3; -khtml-opacity: 0.3; opacity: 0.3; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .userpicfriends img:hover, .userpic img:hover { -moz-opacity:0.9; -khtml-opacity: 0.9; opacity: 0.9; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .date { color: #cecece; font-family: lucida console; text-transform: lowercase; font-size: 9px; text-align: center; display: none; } .subject, h2 { color: #fff!important; font-family: lucida console; font-size: 20px; letter-spacing: 5px; text-transform: uppercase; text-align: left; background: transparent; margin-bottom: -3px; margin-left: 0px; width: 500px; } .subject a:link, .subject a:visited, code, .datesubjectcomment a:link, .datesubjectcomment a:visited { color: #fff; letter-spacing: -2px; padding-right: 5px; -moz-opacity:0.3; -khtml-opacity: 0.3; opacity: 0.3; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .subject a:link:hover { background-color: #EFFAB4; padding-right: 5px; -moz-opacity:0.9; -khtml-opacity: 0.9; opacity: 0.9; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .datesubject { } .currents { margin-top: 10px; margin-bottom: -10px; text-transform: uppercase; color: #FFC48C; font-size: 10px; line-height: 10px; font-family: tahoma; text-align: left; padding-bottom: 2px; } .ljtags { text-transform: uppercase; font-size: 10px; color: #FFC48C; font-family: tahoma; margin-top: 10px; margin-bottom: -5px; text-align: left; } .ljtags a { color: #FFFFFF; background-color: #D1F2A5; } .ljtags a:hover { color: #EFFAB4; background-color: #D1F2A5; } .comments { padding-top: 20px; margin-bottom: -15px; font-family: lucida console; font-size: 10px; text-transform: uppercase; text-align: left; font-weight: bold; color: #D1F2A5!important; letter-spacing: 5px; -moz-opacity:0.3; -khtml-opacity: 0.3; opacity: 0.3; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } .comments:hover { color: #FFFFFF!important; -moz-opacity:0.9; -khtml-opacity: 0.9; opacity: 0.9; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; } /* maincontent -- year/archive pages */ ul.year { text-align: center; padding-bottom: 5px; } ul.year li { display: inline; } table.yeartable { margin-left: auto; margin-right: auto; } table.yeartable td.yeardate, table.yeartable td.yearday { border-width: 0px; border-style: solid; border-color: #999999; } table.yeartable td.yearday { background-color: #eeeeee; text-align: center; } td.yearmonth { border-style: none; } /* footer */ ul.navfooter{ padding: 0px; margin: 0px; } ul.navfooter li { display: inline; margin: 0 5px 0 5px; } .clearfoot { clear: both; } /* misc */ .ljtaglist { list-style-type: none; padding: 10px; background-color: #ffffff; font-family: lucida console; font-size: 9px; text-align: left; } .clear { height: 0px; } .skiplinks { text-align: center; } .headerimage { /* for formatting header image */ } .separator{ height: -60px!important; margin-top: -30px; } /* tiny icons go below here */ img[src*="icon_protected.gif"]{width: 0; height: 0; padding: 11px 10px 0 0 !important; background: url (http://s141.photobucket.com/albums/r56/snakesgirl19/graphics/ico ns/lock.gif);} img[src*="icon_private.gif"]{width: 0; height: 0; padding: 11px 10px 0 0 !important; background: url (http://s141.photobucket.com/albums/r56/snakesgirl19/graphics/ico ns/lock.gif);} img[src*="icon_groups.gif"]{width: 0; height: 0; padding: 11px 10px 0 0 !important; background: url (http://s141.photobucket.com/albums/r56/snakesgirl19/graphics/ico ns/lock.gif);} .ljuser img[src*="userinfo.gif"] { background-image: url (http://i633.photobucket.com/albums/uu58/andshefades/Journal %20Pixels/girl.gif) !important; padding: 9px 9px 0px 0px ! important; width: 0 !important; height: 0 !important;} .ljuser img[src*="community.gif"] { background-image: url (http://i633.photobucket.com/albums/uu58/andshefades/Journal %20Pixels/animal.gif) !important; padding: 9px 9px 0px 0px! important; width: 0 !important; height: 0 !important; } .ljuser img[src*="openid-profile.gif"] { background-image: url (http://i104.photobucket.com/albums/m165/dominiquefrancon/layout/ qnso6d.png)!important; padding: 16px 16px 0px 0px!important; width: 0 !important; height: 0 !important;} .ljuser img[src*="syndicated.gif"] { background-image: url (http://i104.photobucket.com/albums/m165/dominiquefrancon/layout/ smilies/cupcake.gif) !important; padding: 15px 15px 0px 1px ! important; width: 0 !important; height: 0 !important;} /* Start http://www.cursors-4u.com */ body, a:hover {cursor: url (http://cur.cursors-4u.net/nature/nat-10/nat990.cur), progress ! important;} /* End http://www.cursors-4u.com */

{ ads between entries (as always)
{ tinyicons added, as well as a cute cursor
{ change the colours/change whatever you like, as long as there is credit somewhere to novoluxa
{ comments/questions HERE, thanks xx