layout 053: Finding Decadence In Kisses (flexible squares)
Submitted by akay_gemini.
Live Preview || Image Preview
/*-- 053: Finding Decadence In Kisses (flexible squares) --*/
/*-- stylesheet by ravenclawbest @ visualwit for LJ --*/
/*-- preferred ad style - vertical --*/
/*-- feel free to edit but please don't remove this header --*/
/*-- main --*/
BODY {
background-color: #29001E;
color: #090500;
text-align: left;
font-size: 11px;
margin: auto;
font-family: arial, tahoma, sans-serif;
}
#content {
width: 850px;
margin: auto;
margin-top: 5px;
}
#maincontent {
margin: auto;
margin-right: 190px;
}
.subcontent {
background-color: #911635;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
a, a:link, a:visited {
color: #911635;
text-decoration: none;
}
a:hover {
color: #0D0D0D;
}
b, strong, u {
color: #29001E;
}
code, kbd, pre, tt {
font-family: sans-serif;
}
::-moz-selection {
background-color: #090500;
color: #B22140;
}
/*-- header pattern --*/
.headerimage {
width: auto;
height: 0px;
position: relative;
margin-left: auto;
margin-right: auto;
margin-bottom: 0px;
background-image: url('http://img30.imageshack.us/img30/4260/663234.png');
background-repeat: repeat;
}
/*-- navigation --*/
#header {
float: center;
background-color: transparent !important;
font-size: 25px;
text-align: right;
text-transform: lowercase;
font-family: georgia, serif;
margin-bottom: -10px;
}
#footer {
float: center;
text-align: center;
clear: both;
}
div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
color: #911635;
}
div#header a:hover, div#footer a:hover, div#header li.view {
color: #B22140;
}
div#footer li.viewing {
display: none;
}
ul.navheader li, ul.navfooter li {
padding: 0px 10px 0px 10px;
display: inline;
list-style: none;
}
.clearfoot {
clear: both;
}
/*-- title --*/
.title {
display: none;
}
/*-- subtitle --*/
.subtitle {
display: none;
}
/*-- entries --*/
.entry {
background-color: #FFFFFF;
min-height: 120px;
color: #5E5E5E;
text-align: justify;
padding: 10px;
margin-right: 135px;
-moz-border-radius-bottomleft: 10px;
-webkit-border-radius-bottomleft: 10px;
}
.entry img{
max-width: 550px;
}
.entry ul li {
margin: 10px;
padding: 0px;
list-style: square;
list-style-position: inside;
}
.entry ol li {
margin: 0px;
padding: 0px;
list-style-position: outside;
list-style: decimal;
}
.entry img{
max-width: 480px;
}
.datesubject {
background-color: #B22140;
padding: 10px 5px 0px 5px;
margin-right: 135px;
border-bottom: 1px #911635 solid;
-moz-border-radius-topleft: 10px;
-webkit-border-radius-topleft: 10px;
}
.date {
text-align: right;
font-weight: bold;
color: #911635;
line-height: 0.001em;
}
.subject {
color: #090500;
font-size: 22px;
text-align: right;
font-family: georgia, serif;
text-transform: lowercase;
}
div.subject a, div.subject a:link, div.subject a:visited {
color: #090500;
letter-spacing: 1px;
}
blockquote {
padding: 8px;
margin: 15px;
text-align: justify;
border: 1px #911635 solid;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
.separator {
height: 10px;
background-color: transparent;
}
/*-- currents --*/
.currents {
background-color: transparent;
text-transform: lowercase;
}
.currents strong {
color: #090500;
font-weight: normal;
}
.currentlocation, .currentmood, .currentmusic, .currentgroup {
text-align: left;
color: #911635;
}
.ljtags {
color: #090500;
text-align: left;
margin-top: 15px;
text-transform: lowercase;
}
.ljtags a {
color: #911635;
text-align: left;
margin-top: 15px;
text-transform: lowercase;
}
/*-- comments --*/
.comments {
margin: 5px 0px 0px 0px;
color: #B22140;
text-align: right;
}
div.comments a, div.comments a:link, div.comments a:visited {
padding: 4px;
color: #29001E;
font-size: 20px;
font-family: georgia, serif;
text-transform: lowercase;
}
#qrform table {
border: 0px !important;
}
/*-- sidebar --*/
#sidebar {
display: ;
background-color: #911635;
width: 160px;
margin: auto;
float: right;
bottom: 0px;
color: #090500;
padding: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
#sidebar a, #sidebar a:link, #sidebar a:visited {
color: #FFFFFF;
text-decoration: none;
}
#sidebar a:hover {
color: #090500;
}
.defaultuserpic {
display: ;
text-align: center;
border: 0px solid #FFEDB8;
}
.defaultuserpic img{
display: none;
text-align: center;
padding: 5px;
border: 0px solid #FFEDB8;
}
.sbarheader, .sbarbody{
padding-top: 10px;
}
.sbarbody2 {
font-size: 11px;
color: #090500;
text-align: justify;
}
table.calendar {
width: auto;
margin-left: auto;
margin-right: auto;
}
ul.sbarlist {
margin: 0px;
padding: 0px;
list-style: none;
display: block;
}
li.sbaritem {
background-color: #B22140;
margin: 3px;
color: #090500;
padding: 4px;
list-style: none;
list-style-position: inside;
text-align: right;
font-weight: normal;
text-transform: none;
display: block;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
li.sbartitle {
display: none;
}
ul.ljtaglist li {
margin: 0px;
padding: 5px;
list-style: none;
}
.sbarbody#sidebar_summary, .sbarbody#sidebar_calendar {
display:none;
}
/*-- userpics --*/
.userpic, .userpicfriends {
margin: 10px 0px 0px 0px;
text-align: center;
position: relative;
float: right;
background-color: transparent !important;
z-index: 15;
padding: 10px;
border: 0px #3D3D3D solid;
}
.userpicfriends font, .userpicfriends a {
color: #29001E;
text-transform: lowercase;
text-align: center;
}
.userpicfriends br {
display: block;
height: 0;
}
.userpic img, .userpicfriends img {
padding: 15px;
max-width: 85px;
max-height: 85px;
background-color: #B22140;
border: 0px #911635 solid;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}
/*-- tag page --*/
.ljtaglist {
list-style: square;
margin: -1px 20px 0px 20px;
text-transform: lowercase;
text-align: left;
background-color: #FFFFFF;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
.ljtaglist li {
padding: 6px 3px 6px 20px;
color: #5E5E5E;
}
H2 {
text-align: center;
background-color: #B22140;
font-size: 11px;
font-weight: normal;
color: #090500;
padding: 10px;
text-transform: lowercase;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
ul.ljtaglist {
color: #5E5E5E;
padding: 8px 8px 8px 12px;
text-align: left;
margin-right: auto;
margin-left: auto;
padding: 25px;
}
ul.ljtaglist li{
padding: 3px;
margin: 2px;
list-style: square;
list-style-position: inside;
}
/*-- archive --*/
ul.year {
background-color: #B22140;
text-align: center;
padding: 5px 0px 5px 0px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
ul.year li {
color: #090500;
display: inline;
padding: 0px 5px 0px 5px;
border: 0px solid #B22140;
}
table.yeartable {
background-color: #911635;
margin-left: auto;
margin-right: auto;
text-transform: lowercase;
width: 100%;
}
td.yearmonth {
background-color: #29001E;
color: #B22140;
border: 0px solid #3D3D3D;
padding: 0px 5px 0px 5px;
}
td.yeardate {
color: #B22140;
background-color: #911635;
border: 1px solid #090500;
text-align: center;
}
td.yeardate a {
color: #FFFFFF;
font-size: 15px;
}
table.yeartable td.yearday {
background-color: #29001E;
text-align: center;
text-transform: lowercase;
border: 0px solid #B22140;
color: #B22140;
}
/*-- comments --*/
.clear {
display: none;
}
.skiplinks {
background-color: #B22140;
text-transform: lowercase;
text-align: center;
color: #090500;
padding: 10px;
margin-bottom: 5px;
border: 0px #3D3D3D solid;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
.skiplinks a {
text-transform: lowercase;
text-align: center;
padding: 10px;
color: #090500;
margin: 3px;
}
.datesubjectcomment {
color: #090500;
padding: 5px;
border-bottom: 2px #090500 solid;
margin-bottom: 5px;
}
.userpiccomment {
padding: 10px;
color: #090500;
max-width: 75px;
max-height: 75px;
background-color: #090500;
border: 0px #090500 solid;
margin: -5px 10px 0px -5px;
z-index: 15;
float: left;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
.box {
background-color: #FFFFFF;
width: auto;
clear: left;
padding: 5px 5px 5px 10px;
border-right: 140px #911635 solid;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
}
textarea {
background-color: #B22140;
color: #0D0D0D;
border: 1px solid #0D0D0D;
}
input {
background-color: #B22140;
border: 1px solid #29001E;
padding: 0px 10px 0px 10px;
}
textarea.textbox{
background-color: #B22140;
color: #0D0D0D;
border: 1px solid #29001E;
width: 95% !important;
}
.reply{
position: relative;
margin: 5px;
padding: 5px;
text-align: left;
line-height: 125%;
}
.replytosubject {
font-weight: bold;
text-transform: lowercase;
}
.commentbox {
margin: 5px;
border-top: 0px dotted #0D0D0D;
}
.commentboxpartial {
padding: 5px;
margin: 12px;
}
.commentreply {
position: relative;
padding: 10px 10px 20px 90px;
}
.commentinfo {
margin-top: 10px;
width: 100%;
}
/*-- mini icons by icojoy --*/
.ljuser img {
width: 0;
height: 0;
background: transparent url(http://i38.tinypic.com/15wfpja.png) no-repeat 0 0;
padding: 15px 15px 0px 2px !important; vertical-align: baseline !important;
}
.ljuser img[src*="userinfo.gif"] {
background: transparent url(http://i38.tinypic.com/15wfpja.png) no-repeat 0 0 !important;
padding: 15px 15px 0px 2px !important;
}
.ljuser img[src*="community.gif"] {
width: 0;
height: 0;
background: transparent url(http://i45.tinypic.com/29w8pzs.png) no-repeat scroll 0 0 !important;
padding: 15px 15px 0px 2px !important;
}
.subject img {
vertical-align: middle !important;
}
img[src*="icon_protected.gif"]{
width: 0;
height: 0;
padding: 16px 18px 0px 0px !important;
background: transparent url(http://i36.tinypic.com/2uz31op.png) no-repeat scroll 0 0;
}
img[src*="icon_groups.gif"]{
width: 0;
height: 0;
padding: 16px 18px 0px 0px !important;
background: transparent url(http://i36.tinypic.com/2uz31op.png) no-repeat scroll 0 0;
}
img[src*="icon_private.gif"]{
width: 0;
height: 0;
padding: 16px 18px 0px 0px !important;
background: transparent url(http://i36.tinypic.com/2uz31op.png) no-repeat scroll 0 0;
}
img[src*="btn_del.gif"] {
height: 0px;
width: 0px;
padding: 0px 0px 16px 16px !important;
background: url(http://i39.tinypic.com/144739d.png) no-repeat scroll 0 0;
}
img[src*="btn_scr.gif"] {
height: 0px;
width: 0px;
padding: 0px 0px 16px 16px !important;
background: url(http://i43.tinypic.com/358rj2a.png) no-repeat scroll 0 0;
}
img[src*="btn_unscr.gif"] {
height: 0px;
width: 0px;
padding: 0px 0px 16px 16px !important;
background: url(http://i39.tinypic.com/2drnh3.png) no-repeat scroll 0 0;
}
img[src*="btn_freeze.gif"] {
height: 0px;
width: 0px;
padding: 0px 0px 16px 16px !important;
background: url(http://i40.tinypic.com/17afb4.png) no-repeat scroll 0 0;
}
img[src*="btn_unfreeze.gif"] {
height: 0px;
width: 0px;
padding: 0px 0px 16px 16px !important;
background: url(http://i44.tinypic.com/242zlet.png) no-repeat scroll 0 0;
}
img[src*="btn_track.gif"] {
height: 0px;
width: 0px;
padding: 0px 0px 16px 16px !important;
background: url(http://i44.tinypic.com/5zmpvk.png) no-repeat scroll 0 0;
}
img[src*="btn_tracking.gif"] {
height: 0px;
width: 0px;
padding: 0px 0px 16px 16px !important;
background: url(http://i43.tinypic.com/aakt3q.png) no-repeat scroll 0 0;
}
img[src*="btn_tracking_thread.gif"] {
height: 0px;
width: 0px;
padding: 0px 0px 16px 16px !important;
background: url(http://i39.tinypic.com/71pcmf.png) no-repeat scroll 0 0;
}
img[src*="anonymous.gif"] {
height: 0px;
width: 0px; padding: 0px 0px 16px 16px !important;
background: url(http://i40.tinypic.com/2ngfymo.png) no-repeat scroll 0 0;
}
img[src*="openid-profile.gif"] {
height: 0px;
width: 0px;
padding: 0px 0px 16px 16px !important;
background: url(http://i44.tinypic.com/35b5evp.png) no-repeat scroll 0 0;
}
.box img[src*="userinfo.gif"] {
height: 0px;
width: 0px;
padding: 0px 0px 16px 16px !important;
background: url(http://i40.tinypic.com/33c56o1.png) no-repeat scroll 0 0;
}
img[src*="talk/none.gif"] {
height: 0px;
width: 0px;
padding: 0px 0px 10px 10px !important;
background: url(http://i39.tinypic.com/2ry4o4k.png) no-repeat scroll 0 0;
}
img[src*="help.gif"] {
height: 0px;
width: 0px;
padding: 0px 0px 16px 16px !important;
background: url(http://i44.tinypic.com/zwkxvc.png) no-repeat scroll 0 0;
}
img[src*="pencil.gif"] {
height: 0px;
width: 0px;
padding: 0px 0px 16px 16px !important;
background: url(http://i40.tinypic.com/2zibpg8.png) no-repeat scroll 0 0;
}
/*------- contextual pop-up -------*/
div.ContextualPopup {
position: relative;
margin: auto;
text-align: left;
width: 270px;
}
div.ContextualPopup div.Inner {
color: #0d0d0d !important;
border: 1px solid #B22140;
}
div.ContextualPopup .Userpic {
padding: 5px;
margin: 5px;
background-color: #911635;
border: 0px #0d0d0d solid;
}
div.ContextualPopup .Content {
background-color: #FFFFFF;
border: 1px solid #B22140;
margin: auto;
}
div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited, div.ContextualPopup div.Inner a:link {
text-decoration: none !important;
font-weight: bold;
color: #B22140 !important;
}
div.ContextualPopup .Relation {
text-transform: lowercase;
color: #0D0D0D;
}
/*-- navigation bar --*/
table#lj_controlstrip td {
background-color: #B22140;
border: solid 0px #0d0d0d;
}
#lj_controlstrip input {
background-color: #B22140;
color: #0D0D0D;
border: 1px solid #29001E;
padding: 0px 5px 0px 5px;
}
#lj_controlstrip a {
color: #090500;
}
#lj_controlstrip_statustext {
color: #090500;
}
#lj_controlstrip .ljuser a b {
color: #090500;
}
#lj_controlstrip_userpic {
display:none;
}
/*-- paste additional codes below this point --*/
CREDIT:
★- Comments are ♥
★- Credit & watch visualwit for updates
NOTES:
★- IE doesn't register the rounded corners.
★- My FAQ post. Refer to this for directions on adding headers/banners and such.
DIRECTIONS:
★- Select Journal Style
★- Select any Flexible Squares layout except 'Circles'
★- Go to Custom CSS and set all drop down boxes to No
★- Paste code in 'Custom Stylesheet' text box
ADDITIONAL DIRECTIONS:
★- Ads should be VERTICAL with Blurb, Links, & Tags visible.
FAQ:
★- Can I tweak the code (color, font, etc)? Certainly, just don't remove the header at the beginning of the css code. Please note that I'll be unavailable to help with any unnecessary modifications (turning a sidebar into a topbar, changing fonts, etc).
★- I have a question about the layout, where should I post my questions should I have any problems with it? At the layout post is fine, though you may also post general layout questions at the FAQ post.
OTHER RESOURCES:
★- s2flexisquares is the main tutorial/how to site for flexible squares