When It Rains

Nov 16, 2010 14:24



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/">http://i51.tinypic.com/2gy6j9u.jpg" />



Code:

/****************************************

Layout by http://community.livejournal.com/abellalayouts/
Style: Flexible Squares, S2
Layout: When It Rains

****************************************/

/* Colors
dark pink: #7b3f47
light pink: #f9d8d3
dark green: #454F2D
*/

*{margin: 0; padding: 0;}

body{ background: url(http://i53.tinypic.com/33auno2.jpg) repeat; font-family: Times, Times New Roman, serif; font-size:12px; color: #fff; }

a, a:link, a:visited , a:active { color: #7b3f47; text-decoration: none; }

a:hover{color: #ffe7f1;}

h2 {display: none;}

#content{ margin: 0 auto; }

#maincontent{ width: 670px; margin: 20px auto 0 auto; background: url(http://i56.tinypic.com/264gket.jpg) repeat; *margin: 10px auto 0 300px; }
.lj-view-archive #maincontent {}
.lj-view-tags #maincontent {}

.subcontent{ padding: 20px; }

.entry { margin: 20px 0 auto 0; }

.entry_text{ font-size: 14px; line-height: 1.3; padding: 0 15px}

.entry_text a, .entry_text a:link, .entry_text a:visited , .entry_text a:active { color: #f9d8d3; background: #7b3f47; text-decoration: none; padding: 0 2px}

.entry_text a:hover { color: #7b3f47; background: #f9d8d3; }

#header{ color:#fff; font-size: 18px; text-transform: lowercase; float: right; max-width: 260px; position: fixed; right: 0}

.title, .subtitle {color: #454f2d; font-size: 36px; line-height: 0.7; text-align: right; margin: 0 auto; font-style: italic; padding: 0 5px; text-shadow: 1px 1px 5px #ffffff; filter: dropshadow(color=#ffffff, offx=1, offy=1);}

.headerimage {background: url() no-repeat; margin: 0 auto; width: 0px; height: 0px }

div#header li { }

div#header li.view { font-size: 22px; text-shadow: 1px 1px 5px #ffffff; filter: dropshadow(color=#ffffff, offx=1, offy=1); font-style: italic;}

div#header a, div#header a:link, div#header a:visited { color: #fff; font-size: 22px; }

div#header a:hover { color: #454f2d; font-size: 22px; text-shadow: 1px 1px 5px #ffffff; filter: dropshadow(color=#ffffff, offx=1, offy=1); font-style: italic;}

ul.navheader{ color: #454f2d}

ul.navheader li{ list-style: none; background: url(http://i56.tinypic.com/264gket.jpg); padding: 0 5px; margin: 5px 0 }

ul.navheader li:hover {}

#sidebar{ font-size: 10px; text-transform: lowercase; float: left; width: 200px; text-align: left; padding: 5px; background: url(http://i56.tinypic.com/264gket.jpg)}

.defaultuserpic {text-align: center; margin: 10px}

.defaultuserpic img {padding: 5px; background: #7b3f47; -webkit-box-shadow: 1px 1px 15px #ffffff; -moz-box-shadow: 1px 1px 15px #ffffff; box-shadow: 1px 1px 15px #ffffff;}

.sbarbody2 {font-size: 12px; padding: 5px; max-height: 220px; overflow-y: auto; line-height: 1.0}

li.sbartitle {font-size: 22px; text-shadow: 1px 1px 5px #ffffff; filter: dropshadow(color=#ffffff, offx=1, offy=1); font-style: italic; color: #454f2d; padding-left: 2px; margin-top: 10px}

table.calendar {text-align: center; color: #fff; margin: 0 auto; font-size: 14px}

.sbarcalendar, .sbarcalendarposts { padding: 3px 6px; background: #7b3f47;}

.sbarcalendarposts a, .sbarcalendarposts {color: #454f2d ; text-shadow: 0 0 7px #ffffff; filter: dropshadow(color=#ffffff, offx=1, offy=1); font-weight: bold }

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: 15px; color: #fff}

li.sbaritem a:hover {text-shadow: 1px 1px 5px #ffffff; filter: dropshadow(color=#ffffff, offx=1, offy=1); font-style: italic; color: #454f2d}

.userpic, .userpicfriends{ float: right; text-align:center; padding: 0 0 5px 5px; background: transparent !important}
.userpicfriends font, .userpicfriends a {color: #fff}

.userpic img, .userpicfriends img { padding: 10px; background: #7b3f47; -webkit-box-shadow: 1px 1px 15px #ffffff; -moz-box-shadow: 1px 1px 15px #ffffff; box-shadow: 1px 1px 15px #ffffff;}

.userpic img:hover, .userpicfriends img:hover { background: #ffe7f1}

.subject{ }

.subject a, .subject { line-height: 0.7; color: #f9d8d3; font-size: 22px; font-style: italic; }

.subject a:hover {color: #454F2D; text-shadow: 1px 1px 5px #ffffff; filter: dropshadow(color=#ffffff, offx=1, offy=1);}

.date{ line-height: 1; font-size:18px; color:#fff; letter-spacing: 2px; font-style: italic}

.datesubject{ text-align: left; background: #7b3f47; -webkit-box-shadow: 1px 1px 15px #ffffff; -moz-box-shadow: 1px 1px 15px #ffffff; box-shadow: 1px 1px 15px #ffffff; width: 400px; 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: 0px auto;}

div.comments a, div.comments a:visited, div.comments a:active{color: #f9d8d3; font-style: italic; font-size: 18px; background: #7b3f47; -webkit-box-shadow: 1px 1px 15px #ffffff; -moz-box-shadow: 1px 1px 15px #ffffff; box-shadow: 1px 1px 15px #ffffff; padding: 5px 10px}

div.comments a:hover{ color: #454F2D; text-shadow: 1px 1px 5px #ffffff; filter: dropshadow(color=#ffffff, offx=1, offy=1);}

#footer{ position: fixed; right: 0; bottom: 4px; color: #454F2D; font-size: 15px; text-transform: lowercase}

#footer a:link, #footer a:visited {color: #f9d8d3; font-style: italic; font-size: 18px; background: #7b3f47; -webkit-box-shadow: 1px 1px 15px #ffffff; -moz-box-shadow: 1px 1px 15px #ffffff; box-shadow: 1px 1px 15px #ffffff; padding: 5px 20px 5px 20px}

div#footer a:hover {color: #454F2D; text-shadow: 1px 1px 5px #ffffff; filter: dropshadow(color=#ffffff, offx=1, offy=1)}

#footer .viewing { display: none}

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: 15px; color: #f9d8d3; font-style: italic}

div.ljtags a {color: #fff !important; font-size: 13px; font-weight: normal; background: transparent !important; font-style: normal}

.currents{ color: #fff; font-size: 13px; margin-top: -33px; margin-left: 11px}

.currentlocation, .currentmood, .currentmusic{ padding-left: 9px; color: #fff; margin-top: 5px}

.currentlocation a {color: #fff;}

.currents strong {font-weight: 900; color: #f9d8d3; font-size: 15px; background: #7b3f47; padding: 0 2px; font-style: italic; font-weight: normal }

blockquote {font-size: 13px; padding: 10px; margin: 10px 0 10px auto; width: 90%; color: #f9d8d3; font-style: italic; text-indent: 25px; text-align: justify; line-height: 1; border-left: 5px solid #7b3f47; border-top: 2px solid #7b3f47; border-bottom: 2px solid #7b3f47}

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

#lj_controlstrip {background: url(http://i53.tinypic.com/33auno2.jpg) repeat;}

#lj_controlstrip a:link, #lj_controlstrip a:visited, #lj_controlstrip a:active, #lj_controlstrip, #lj_controlstrip_statustext {color: #454f2d}

.separator {}

.box {padding: 30px}

.commentbox {}

.datesubjectcomment {background: #7b3f47; -webkit-box-shadow: 1px 1px 15px #ffffff; -moz-box-shadow: 1px 1px 15px #ffffff; box-shadow: 1px 1px 15px #ffffff; width: 400px; padding: 10px; color: #f9d8d3; font-size: 18px; width: 100%; font-style: italic}

.datesubjectcomment b {color: #fff}

.userpiccomment {float: left; margin-left: -150px; margin-top: -10px; padding: 5px; background: #7b3f47; -webkit-box-shadow: 1px 1px 15px #ffffff; -moz-box-shadow: 1px 1px 15px #ffffff; box-shadow: 1px 1px 15px #ffffff; }

.commentreply {margin-top: 15px; font-size: 14px; padding: 0 10px}

.skiplinks a { color: #f9d8d3}
.skiplinks {text-align: center;}

table.yeartable {margin: 0 auto; font-size: 14px}

td.yeardate {background: #7b3f47; padding: 0 5px}

.yeardate a {color: #f9d8d3}

ul.year {padding: 10px 30px }

table.yeartable td.yearday {padding-left: 0px;}

type: layouts, layout: flexible squares

Previous post Next post
Up