True Color
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, 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
Button:
http://community.livejournal.com/abellalayouts/">
Code:
/****************************************
Layout by http://community.livejournal.com/abellalayouts/
Style: Flexible Squares, S2
Layout: True Color
****************************************/
/* Colors
navy: #2e2f68
pink: #db6d5e
purple: #906290
medium grey: #d0d0d0
*/
*{margin: 0; padding: 0;}
body{ background: url(http://www.sadmuffin.net/cherrybam/myspacelayouts/surreal/02.jpg) repeat fixed #906290; font-family: 'Cambo', serif; font-size:12px; color: #d0d0d0; }
a, a:link, a:visited , a:active { color: #db6d5e; text-decoration: none;}
a:hover{color: #906290;}
h2 {display: none;}
#content{ width: 800px; margin: 20px auto 0 auto; background: url(http://i42.tinypic.com/2v3g6xv.jpg) repeat; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;}
#maincontent{ width: 560px; margin: 0 10px 0 auto; padding: 5px; height: 620px; overflow-y: scroll}
.lj-view-archive #maincontent {}
.lj-view-tags #maincontent {}
#maincontent::-webkit-scrollbar {width: 10px;}
#maincontent::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.6); border-radius: 10px;}
#maincontent::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,1.0); background: rgba(0,0,0,0.3)}
.subcontent{ padding: 5px; }
.entry { margin: 20px 0 auto 0; }
.entry_text{ font-size: 13px; line-height: 1.4; padding: 0 15px}
#header{ color:#d0d0d0; font-size: 18px; text-transform: lowercase; padding: 10px;}
.title, .subtitle {color: #906290; font-size: 32px; line-height: 0.7; text-align: center; margin: 0 auto; font-family: 'Sofia'; text-shadow: 2px 1px 2px #2e2f68; filter: dropshadow(color=#2e2f68, offx=2, offy=1);}
.headerimage {background: url() no-repeat; margin: 0 auto; width: 0px; height: 0px }
div#header li { }
div#header li.view { }
ul.navheader li:first-child:before {content: none}
div#header a, div#header a:link, div#header a:visited { color: #fff; font-size: 18px; }
div#header a:hover { color: #db6d5e;}
ul.navheader{ color: #db6d5e; padding-bottom: 10px; text-align: center}
ul.navheader li{ list-style: none; display:inline }
ul.navheader li:before {content: '- '; color: #fff}
ul.navheader li:hover {}
#sidebar{ font-size: 10px; text-transform: lowercase; float: left; position: relative; width: 200px; text-align: left; padding: 5px; margin: 0 5px }
.defaultuserpic {text-align: center;}
.defaultuserpic img { -moz-box-shadow: 0px 0px 15px #2e2f68; -webkit-box-shadow: 0px 0px 15px #2e2f68; box-shadow: 0px 0px 15px #2e2f68; }
.sbarbody2 {font-size: 12px; padding: 5px; height: 130px; overflow-y: auto}
.sbarbody2::-webkit-scrollbar {width: 10px;}
.sbarbody2::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.6); border-radius: 10px;}
.sbarbody2::-webkit-scrollbar-thumb { border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,1.0); background: rgba(0,0,0,0.3)}
li.sbartitle {font-family: 'Sofia'; font-size: 16px; margin: 15px 0 2px 0; color: #906290; -moz-box-shadow: 0px 0px 15px #2e2f68; -webkit-box-shadow: 0px 0px 15px #2e2f68; box-shadow: 0px 0px 15px #2e2f68; text-align: center}
table.calendar {text-align: center; color: #d0d0d0; margin: 0 auto}
.sbarcalendar, .sbarcalendarposts { padding: 0px 6px; font-size: 11px}
.sbarcalendar:hover, .sbarcalendarposts:hover {}
.sbarcalendarposts a, .sbarcalendarposts {color: #db6d5e }
ul.sbarlist{ list-style: none; }
li.sbaritem{ list-style: none; padding: 2px 5px }
li.sbaritem a:link, li.sbaritem a:visited, li.sbaritem a:active {font-size: 12px; color: #d0d0d0}
li.sbaritem a:hover {color: #db6d5e}
.userpic, .userpicfriends{ float: right; text-align:center; padding: 5px; background: transparent !important}
.userpicfriends font, .userpicfriends a {color: #fff}
.userpic img, .userpicfriends img {-moz-box-shadow: 0px 0px 15px #2e2f68; -webkit-box-shadow: 0px 0px 15px #2e2f68; box-shadow: 0px 0px 15px #2e2f68; }
.userpic img:hover, .userpicfriends img:hover { background: #906290}
.subject{ }
.subject a, .subject {color: #db6d5e; font-size: 32px; letter-spacing: -2px; line-height: 0.5; font-family: 'Sofia'}
.subject a:hover {color: #d0d0d0;}
.date{ line-height: 1; font-size:13px; color:#906290; }
.datesubject{ text-align: center; }
.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: 0 auto;}
div.comments a, div.comments a:visited, div.comments a:active{font-size: 17px; font-family: 'Sofia' }
div.comments a:hover{ color: #906290}
#footer{ text-align: center; color: #d0d0d0; font-size: 15px; text-transform: lowercase; moz-box-shadow: 0px 0px 15px #2e2f68; -webkit-box-shadow: 0px 0px 15px #2e2f68; box-shadow: 0px 0px 15px #2e2f68; width: 380px; margin: 0 auto; padding: 2px 0}
#footer a:link, #footer a:visited {font-size:16px; font-family: 'Sofia'; color: #906290}
div#footer a:hover {color:#db6d5e}
#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: #db6d5e; font-weight: bold; }
div.ljtags a {color: #d0d0d0; font-size: 12px; font-weight: normal;}
.currents{ color: #d0d0d0; font-size: 12px; margin-top: -33px; margin-left: 11px}
.currentlocation, .currentmood, .currentmusic{ padding-left: 9px; color: #d0d0d0;}
.currentlocation a {color: #d0d0d0;}
.currents strong {font-weight: 900; color: #db6d5e; font-size: 12px}
blockquote {font-size: 12px; padding: 10px; margin: 0 auto; width: 90%; color: #906290; text-indent: 25px; text-align: justify; line-height: 1}
code, kbd, pre, tt { font-family: sans-serif; }
.w-cs {background: rgba(0,0,0,0.0); color: #fff !important;}
.w-cs-status p {color: #fff !important}
.w-cs a:link, .w-cs a:visited, .w-cs a:hover, .w-cs a:active { color: #db6d5e !important; }
/* User info */
.w-cs .w-cs-userinfo { background: rgba(0,0,0,0.0); border-color: #2e2f68;}
/* Summary */
.w-cs .w-cs-summary {background: rgba(0,0,0,0.0); }
.w-cs .w-cs-summary LI.w-cs-i-tokens { border-color: #2e2f68; }
.separator {}
.box {padding: 30px}
.commentbox {moz-box-shadow: 0px 0px 15px #2e2f68; -webkit-box-shadow: 0px 0px 15px #2e2f68; box-shadow: 0px 0px 15px #2e2f68; margin: 20px 0; padding: 10px}
.datesubjectcomment {font-size: 13px; color: #906290}
.userpiccomment {float: right; moz-box-shadow: 0px 0px 15px #2e2f68; -webkit-box-shadow: 0px 0px 15px #2e2f68; box-shadow: 0px 0px 15px #2e2f68; margin: 0 0 10px 10px; width: 60px; height: 60px; }
.commentreply {font-size: 13px; margin-top: 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: 'Sofia';
font-style: normal;
font-weight: 400;
src: local('Sofia'), local('Sofia-Regular'), url('http://themes.googleusercontent.com/static/fonts/sofia/v1/eNNA2vlZnUPtgq9g__E3cA.woff') format('woff');
}
@font-face {
font-family: 'Cambo';
font-style: normal;
font-weight: 400;
src: local('Cambo'), local('Cambo-Regular'), url('http://themes.googleusercontent.com/static/fonts/cambo/v1/Hpv6vCTojizn0Qwl_Bb2SQ.woff') format('woff');
}