The Consequence
Live Preview | IMG | S2 Flexible Squares
Instructions
Note: this layouts looks best when you change your journal ads to "in between entries"
Best view: best viewed in chrome, firefox, IE
Browser Compatible: tested in chrome, firefox, and 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:
Stylesheet by
Code:
/****************************************
Layout by http://community.livejournal.com/abellalayouts/
Style: Flexible Squares, S2
Layout: The Consequence
****************************************/
/* Colors
dark grey: #252525
orange: #ffcb2e
pink: #ff2ec2
*/
*{margin: 0; padding: 0;}
body{ background: url(http://i32.tinypic.com/2cymtqf.jpg) left 50px no-repeat #252525; font-family: Arial, sans-serif; font-size:12px; color: #d0d0d0; }
a, a:link, a:visited , a:active { color: #ffcb2e; font-size: 10px; text-decoration: none; text-transform: uppercase}
a:hover{color: #ff2ec2;}
h2 {display: none;}
.title, .subtitle {color: #ff2ec2; font-size: 18px; line-height: 0.7; text-align: left; margin: 0 auto; position: absolute; margin-left: -15px}
.title {top: 90px; text-transform: none}
.subtitle {top: 105px; font-size: 12px; text-transform: uppercase}
#content{ margin: 10px auto 0 auto; background: url(http://i26.tinypic.com/2dj9pnt.jpg) left bottom no-repeat}
#maincontent{ width: 600px; margin: 0 auto; padding-left: 150px}
.subcontent{ padding: 5px; }
.entry { margin: 20px 0 auto 0; }
.entry_text{ font-size: 10px; line-height: 1.1; padding: 0 15px}
#header{ color:#d0d0d0; font-size: 18px; text-transform: lowercase; margin-left: 520px}
.headerimage {background: url() no-repeat; margin: 0 auto; width: 0px; height: 0px }
div#header li { }
div#header li.view { text-transform: uppercase; font-size: 14px; color: #ff2ec2}
div#header a, div#header a:link, div#header a:visited { color: #fff; font-size: 14px; }
div#header a:hover, div#footer a:hover{ color: #ff2ec2;}
ul.navheader{ color: #ffcb2e; margin-left: 340px; padding-top: 7px}
ul.navheader li{ list-style: none; padding-bottom: 3px}
ul.navheader li + li {padding-left: 10px}
ul.navheader li + li + li {padding-left: 20px}
ul.navheader li + li + li + li {padding-left: 30px}
ul.navheader li + li + li + li + li {padding-left: 40px}
ul.navheader li:hover {}
#sidebar{ font-size: 10px; text-transform: lowercase; float: none; width: 500px; text-align: left; padding: 5px; height: 150px; margin: 0 auto; padding-left: 180px}
.defaultuserpic {text-align: center; position: absolute; top: 140px; left: 750px; margin-top: -10px}
.defaultuserpic img {padding: 2px; background: #ffcb2e; border: 5px solid #ff2ec2}
.sbarbody2 {top: 280px; left: 70px; position: absolute; width: 350px; height: 65px; overflow: hidden; overflow-y: auto; overflow-x: hidden; padding-right: 10px}
li.sbartitle {display: none;}
table.calendar {text-align: center; color: #252525; margin: 0 auto; position: absolute; top: 350px; left: 100px}
.sbarcalendar, .sbarcalendarposts { padding: 4px 8px; background: #ff2ec2; opacity: 0.3}
.sbarcalendar:hover, .sbarcalendarposts:hover {}
.sbarcalendarposts a, .sbarcalendarposts {color: #252525; opacity: 0.7; background: #ffcb2e }
ul.sbarlist{ list-style: none; position: absolute; top: 130px; left: 520px; height: 100px; overflow: hidden; padding-right: 15px}
li.sbaritem{ list-style: none; padding: 2px 5px }
#sidebar_tags ul.sbarlist {top: 200px; overflow: hidden; overflow-y: auto; overflow-x: hidden;}
li.sbaritem a:link, li.sbaritem a:visited, li.sbaritem a:active {font-size: 12px; color: #d0d0d0}
li.sbaritem a:hover {color: #ffcb2e}
.userpic, .userpicfriends{ float: right; text-align:center; padding: 5px; background: transparent !important; margin-right: -50px; margin-top: -5px}
.userpicfriends font {color: #d0d0d0}
.userpic img, .userpicfriends img { padding: 2px; background: #ff2ec2; border: 5px solid #ffcb2e }
.userpic img:hover, .userpicfriends img:hover { background: #ffcb2e; border: 5px solid #ff2ec2}
.subject{ text-align: right; }
.subject a, .subject {color: #ff2ec2; font-size: 13px; line-height: 0.7}
.subject a:hover {}
.date{ line-height: 1; font-size:10px; color:#d0d0d0; text-align: right;}
.datesubject{ }
.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: 0px auto;}
div.comments a, div.comments a:visited, div.comments a:active{font-size: 12px; color: #ff2ec2 }
div.comments a:hover{ color: #ffcb2e}
#footer{ text-align: center; color: #d0d0d0; font-size: 15px; text-transform: lowercase; width: 600px; padding-left: 170px; margin: 0 auto}
#footer a:link, #footer a:visited, #footer:active {font-size:12px;}
div#footer a, div#footer a:link, div#footer a:visited {}
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: #ffcb2e; font-weight: bold; }
div.ljtags a {color: #d0d0d0; font-size: 11px; font-weight: normal;}
.currents{ color: #d0d0d0; font-size: 11px; margin-top: -33px; margin-left: 11px}
.currentlocation, .currentmood, .currentmusic{ padding-left: 9px; color: #d0d0d0;}
.currentlocation a {color: #d0d0d0;}
.currents strong {font-weight: 900; color: #ffcb2e; font-size: 12px}
blockquote { font-size: 11px; padding: 10px; margin: 10px 0; color: #ffcb2e; font-style: italic; text-indent: 25px; text-align: justify; line-height: 1}
code, kbd, pre, tt { font-family: sans-serif; }
#lj_controlstrip { background: #252525}
#lj_controlstrip a:link, #lj_controlstrip a:visited, #lj_controlstrip a:active, #lj_controlstrip, #lj_controlstrip_statustext {color: #ff2ec2}
.separator {background: url(http://i25.tinypic.com/4sh9hv.jpg) right top no-repeat; width: 531px; height: 27px; padding-left: 50px; margin: 20px 0}
.box {padding: 30px}
.commentbox {border-bottom: 5px solid #ff2ec2; border-left: 5px solid #ff2ec2; padding: 10px}
.datesubjectcomment {text-transform: uppercase}
.userpiccomment {border: 2px solid #ffcb2e}
.commentreply {}
.skiplinks, .skiplinks a {text-align: center}
table.yeartable {margin: 0 auto}
ul.year {padding: 10px 30px }
table.yeartable td.yearday {padding-left: 0px;}