underdog
Live Preview | IMG | S2 Flexible Squares
Instructions
Note: this layouts looks best when you change your journal ads to "in between entries"
If you use this header image, PLEASE credit: http://www.flickr.com/photos/i_used_to_be_a_coccinelle/4924573538/
PS: the title/subtitle are the words on the header...in case you didn't notice :)
Best view: best viewed in chrome, firefox
Browser Compatible: tested in chrome, firefox, IE
Rules:
- place the following credit code, or credit abellalayouts, in your Profile or Sidebar
- please comment if you're taking my layout
- feel free to change around the background and colors --> as long as you credit me!
- feel free to ask any questions
- i love feedback! let me know what you think!
- please add me for updates
Credit:
Layout by
Code:
/****************************************
Layout by http://community.livejournal.com/abellalayouts/
Style: Flexible Squares, S2
Layout: Underdog
****************************************/
/* Colors
white: #fff
lavender: #e6ccff
deep purple: #2a003d
grey: #cbcbcb
*/
*{margin: 0; padding: 0;}
body{ background: url(http://i55.tinypic.com/vqpjyp.jpg) #fff; font-family: Tahoma, sans-serif; font-size:12px; color: #000; }
a, a:link, a:visited , a:active { color: #d5a8ff; text-decoration: none;}
a:hover{color: #2a003d;}
h2 {display: none;}
.title, .subtitle {color: #2a003d; font-size: 32px; line-height: 0.7; text-align: center; margin: 0 auto; position: absolute; font-family: Reenie Beanie, Tahoma, sans-serif; left: 32%; *font-size: 22px}
.title {top: 85px;}
.lj-view-entry .title {top: 105px}
.subtitle {top: 100px;}
.lj-view-entry .subtitle {top: 120px}
#content{ margin: 0 auto; }
#maincontent{ width: 700px; margin: 0 auto; }
.lj-view-archive #maincontent {}
.lj-view-tags #maincontent {}
.subcontent{border-top: 5px solid #e6ccff}
.entry { margin: 20px 0 auto 0; }
.entry_text{ font-size: 12px; line-height: 1.4; padding: 0 15px}
#header{ color:#fff; font-size: 18px; text-transform: lowercase; margin-bottom: 40px}
.headerimage {background: url(http://whi.s3.prod.lg1x8.simplecdn.net/images/3757115/4924573538_6af437bb8a_z_large.jpg?1283785116) no-repeat; margin: 10px auto 0 auto; width: 500px; height: 300px; border: 15px solid #e6ccff }
div#header li { }
div#header li.view { font-family: Reenie Beanie, Tahoma, sans-serif; font-size: 28px; background: #2a003d; padding: 2px 20px; -webkit-border-bottom-right-radius: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; *font-size: 18px}
div#header a, div#header a:link, div#header a:visited { color: #2a003d; font-size: 28px; font-family: Reenie Beanie, Tahoma, sans-serif; background: #e6ccff; padding: 2px 20px; -webkit-border-bottom-right-radius: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; *font-size: 18px}
div#header a:hover { color: #fff; background: #2a003d}
ul.navheader{ color: #fff; text-align: center; width: 530px; margin: 0 auto}
ul.navheader li{ list-style: none; display: inline; }
ul.navheader li:hover {}
#sidebar{ font-size: 10px; text-transform: lowercase; float: left; position: relative; width: 200px; text-align: left; padding: 0 5px; border-top: 5px solid #e6ccff}
.defaultuserpic {text-align: center;}
.defaultuserpic img {padding: 10px; background: #e6ccff; webkit-border-bottom-right-radius: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; margin-top: -5px;}
.sbarbody2 {font-size: 11px; padding: 5px; height: 150px; overflow-y: auto; }
li.sbartitle {display: none;}
table.calendar {text-align: center; color: #000; margin: 0 auto}
.sbarcalendar, .sbarcalendarposts { padding: 3px 6px; border-top: 5px solid #e6ccff;}
.sbarcalendar:hover, .sbarcalendarposts:hover, .sbarcalendarposts {border-top: 5px solid #2a003d}
.sbarcalendarposts a, .sbarcalendarposts {color: #2a003d }
ul.sbarlist{ list-style: none; border-top: 5px solid #e6ccff; margin: 15px 0}
li.sbaritem{ list-style: none; padding: 4px 5px; text-align: center}
li.sbaritem a:link, li.sbaritem a:visited, li.sbaritem a:active {font-size: 12px; padding: 5px 0; color: #2a003d}
li.sbaritem a:hover {color: #e6ccff}
.userpic, .userpicfriends{ float: right; text-align:center; padding: 5px; background: transparent !important}
.userpicfriends font, .userpicfriends a {color: #2a003d}
.userpic img, .userpicfriends img {padding: 10px; background: #e6ccff; webkit-border-bottom-right-radius: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; margin-top: -10px; margin-right: -5px; width: 80px; height: 80px}
.subject{ }
.subject a, .subject {color: #2a003d; font-size: 30px; line-height: 0.5; font-family: Reenie Beanie, Tahoma, sans-serif; *font-size: 18px; *line-height: 0.8}
.date{ line-height: 1; font-size:10px; color:#000; letter-spacing: 5px; text-align: center}
.datesubject{ text-align: left; background: #e6ccff; -webkit-border-bottom-right-radius: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; width: 300px; padding: 10px}
.entry ol {padding: 5px 0}
.entry ul { list-style: circle; padding: 5px 0 }
.entry ol li{ padding-left: 5px; margin-left: 45px;}
.entry ul li {padding-left: 7px; margin-left: 43px; }
.comments{ text-align: right; color:transparent; margin-bottom: -10px}
div.comments a, div.comments a:visited, div.comments a:active{font-size: 16px; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; background: #e6ccff; color: #2a003d; padding: 5px 10px}
div.comments a:hover{ color: #e6ccff; background: #2a003d}
#footer{ text-align: center; color: #000; font-size: 15px; text-transform: lowercase; border-bottom: 5px solid #e6ccff; width: 700px; margin: 0 auto}
#footer a:link, #footer a:visited {font-size:15px; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; background: #e6ccff; color: #2a003d; padding: 5px 30px; margin-bottom: 5px}
div#footer a:hover {background: #2a003d; color: #e6ccff;}
#footer .viewing { }
ul.navfooter{ padding: 0; margin: 0; display: inline;}
ul.navfooter li{ margin: 0 5px; display: inline; }
.clearfoot{ clear: both; }
div.ljtags {margin-top: 15px; padding: 3px 5px; font-size: 12px; color: #2a003d; font-weight: bold; }
div.ljtags a {color: #000; font-size: 11px; font-weight: normal;}
.currents{ color: #000; font-size: 11px; margin-top: -31px; margin-left: 11px}
.currentlocation, .currentmood, .currentmusic{ padding-left: 9px; color: #000;}
.currentlocation a {color: #000;}
.currents strong {font-weight: 900; color: #2a003d; font-size: 12px}
blockquote {font-size: 11px; padding: 10px; margin: 10px auto; width: 90%; color: #2a003d; text-indent: 25px; text-align: justify; line-height: 1; border-top: 2px solid #e6ccff; border-bottom: 2px solid #e6ccff}
code, kbd, pre, tt { font-family: sans-serif; }
#lj_controlstrip {background: url(http://i54.tinypic.com/vzemgn.jpg) }
#lj_controlstrip a:link, #lj_controlstrip a:visited, #lj_controlstrip a:active, #lj_controlstrip, #lj_controlstrip_statustext {color: #2a003d}
.separator {}
.box {padding: 30px}
.commentbox {border-top: 5px solid #e6ccff; margin: 10px 0; }
.datesubjectcomment {margin: 10px 10px 0 10px; color: #2a003d}
.userpiccomment {padding: 10px; background: #e6ccff; webkit-border-bottom-right-radius: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; width: 80px; height: 80px; float: left; margin: -15px 10px 10px -10px}
.commentreply {margin: 10px}
.skiplinks a { }
.skiplinks {text-align: center;}
table.yeartable {margin: 0 auto}
ul.year {padding: 10px 30px }
table.yeartable td.yearday {padding-left: 0px;}
@font-face {
font-family: 'Reenie Beanie';
font-style: normal;
font-weight: normal;
src: local('Reenie Beanie'), url('http://themes.googleusercontent.com/font?kit=ljpKc6CdXusL1cnGUSamX_cCQibwlboQP4eCflnqtq0') format('truetype');
}