[layout: flexible squares] #10 Dignified

[calixa]

Theme: Flexible Squares S2
Works with: paid, basic and plus
Tested on: Firefox & IE* (see note below), 1024x768 resolution
Includes: Comment pages, Sidebar, Currents, Archive
Disabled: none



live preview | image preview


Copy & Paste:

/*---------------------------------------------------

FLEXIBLE SQUARES S2
"Dignified" by calixa @ biconic.livejournal.com

-----------------------------------------------------*/

body {
background-color: #8E6164;
background-image: url();
background-repeat: repeat-all;
text-align: justify;
color: #C9C4BC;
font-family: "trebuchet", sans-serif;
font-size: 8pt;
margin: 20px 0 0px 0;
}

a, a:link, a:visited {
color: #B7AFA5;
text-decoration: none;
}

a:hover {
color: #A5983F;
text-decoration: none;
}

b {
color: #B7AFA5;
}

blockquote {
font-family: "arial narrow";
font-size: 8pt;
padding: 10px 10px 10px 10px;
line-height: 170%;
background-color: #EFEBE6;
color: #9A9387;
border-top: #B7AFA5 1px dashed;
border-bottom: #B7AFA5 1px dashed;
}

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

#qrform table{ border: 0 !important;}

/*---------------------------------------------------------------------
General page alignment and width
------------------------------------------------------------------------*/

#content {
width: 80%;
margin: 0px auto 0px auto;
padding: 0px 0px 0px 0px;

}

#maincontent {
margin: 0px 205px 0px 0px;
padding: 0px 0px 0px 0px;
background-color: #F7F5F2;
border-top: #B6AA58 110px solid;
}

#sidebar {
margin: 0px 0px 0px 0px;
padding: 20px 0px 20px 0px;
font-family: "tahoma", sans-serif;
width: 200px;
float: right;
text-align: left;
color: #908C85;
border-top: #A5983F 110px solid;
background-color: #F7F5F2;
}
/*-----------------------------------------------------------------------------
Header
--------------------------------------------------------------------------------*/
#header {
width: auto;
padding: 10px 5px 10px 20px;
margin: 0px 0px 0px 0px;
background-color: #67544D;
border-bottom: #67544A 1px solid;
text-align: right;
}

.headerimage {
position: relative;
width: 800px;
height: 0px;
background-image:url();
margin: 10px auto 0px auto;
}

div#header a, div#header a:link, div#header a:visited {
color: #8795A0;
padding: 5px;
text-decoration: none;
}

div#header a:hover {
color: #AFB7BE;
text-decoration: none;
}

.title {
display: none;
}

.subtitle {
display:none
}

li.view {
color: #B7AFA5;
padding: 5px !important;
margin-right: 1px;
}

ul.navheader {
padding: 0px;
margin: 0px;
}

ul.navheader li {
display: inline;
padding: 0 1px 0 0px;
}

/*-----------------------------------------------------------------------------
Entry stuff
------------------------------------------------------------------------*/

.subcontent {
margin: 20px 0px -10px 0px;
padding: 0px 20px 0px 20px;
}

.entry {
margin: 0px 0px 10px 0px;
padding: 10px;
color: #908C85;
font-family: "trebuchet", sans-serif;
letter-spacing: 0px;
font-size: 8pt;
text-align: justify;
}

.datesubject {
margin: 0px 0px 0px 0px;
padding: 15px 0px 3px 10px;
text-align: left;
}

.date {
margin: 5px 10px 5px 0px;
color: #B7AFA5;
font-family: "Verdana", sans-serif;
font-size: 7pt;
font-style: italic;
text-transform: uppercase;
}

.subject {
color: #9C8081;
padding: 0px 0px 5px 0px;
font-family: "tahoma", serif;
font-size: 15pt;
font-weight: normal;
line-height: 100%;
letter-spacing: 0px;
text-transform: none;
}

.subject a, .subject a:link, .subject a:visited {
color: #ff3399;
}

.subject a:hover {
color: #818181;
}

.ljtags {
margin: 15px 0px 0px 0px;
padding: 5px;
color: #B7AFA5;
font-size: 7pt;
text-align: left;
background-color: #EFEBE6;
width: 250px;
}

.ljtags a:link, .ljtags a:visited {
color: #9C8081;}

.ljtags a:hover {
color: #B6AA58;}

.entry ul li, .entry ol li {
padding-left: 2px;
margin-left: 3px;
}

/*------------------------------------------------------------
Userpics
-------------------------------------------------------------------------------*/

.userpic, .userpicfriends {
position: relative;
float: right;
padding: 0px;
margin: 20px 0px 5px 15px;
text-align: center;
background-color: #F7F5F2 !important;
font-size: 10px;
z-index: 15;

}

.userpic img, .userpicfriends img {
border: #EFEBE6 3px solid;
}

.userpicfriends font {
color: #767369;
font-size: 7pt;
}

/*---------------------------------------------------------------------
Entry Stuff - Current Mood, Music and Location
------------------------------------------------------------------------*/

.currents {
font-family: "Verdana", sans-serif;
font-size: 7pt;
padding: 5px 5px 0px 0px;
margin-top: 0px;
}

.currentmood, .currentmusic, .currentlocation {
font-family: "Verdana", sans-serif;
font-size: 7pt;
}

/*---------------------------------------------------------------------
Entry Stuff - Comments
------------------------------------------------------------------------*/

.comments {
font-family: "arial", sans-serif;
font-size: 10px;
text-align: right;
margin-top: 10px;
border-top: #D3CEC7 1px dashed;
background-color: #F7F5F2;
color: #F7F5F2;
padding: 5px 0px 0px 5px;
position: relative;
}

div.comments a, div.comments a:link, div.comments a:visited{
color: #B7AFA5;
}

div.comments a:hover {
color: #B6AA58;
text-decoration: none;
}

/*---------------------------------------------------------------------
Entry Stuff - Separator
------------------------------------------------------------------------*/

.separator{
/* for formatting separators between entries */
height: 0px;
}

/*------------------------------------------------------------
Sidebar
-------------------------------------------------------------------------------*/

.defaultuserpic {
display:none;
}

.sbarheader {
padding: 0px 0px 0px 0px;
}

.sbarbody {
padding: 0px 0px 0px 0px;
}

.sbarbody2 {
margin: 0px;
padding: 10px 20px 10px 20px;
font-family: "arial";
text-align: justify;
font-size: 8pt;
}

div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #B7AFA5;
text-transform: lowercase;
}

div#sidebar a:hover {
color: #A5983F;
text-decoration: none;
}

/*------------------------------------------------------------
Sidebar - Calendar
-------------------------------------------------------------------------------*/

table.calendar {
margin:auto;
}

.sbarcalendar {
text-align: center;
padding: 5px;
font-size: 7pt;
color: #8E6164;
background-color: #EFEBE6;
}

.sbarcalendarposts {
background-color: #EFEBE6;
text-align: center;
padding: 5px;
font-size: 7pt;
}

/*------------------------------------------------------------
Sidebar - link box contents and sidebar box titles
-------------------------------------------------------------------------------*/

ul.sbarlist
{
padding: 0px;
margin: 0px 0px 20px 0px;
list-style: none;
}

li.sbaritem
{
padding: 2px 10px 2px 10px;
margin: 0px 20px 1px 20px;
list-style: none;
text-align: left;
background-color: #EFEBE6;
}

li.sbartitle
{
padding:0px 10px 0px 0px;
margin: 0px 20px 0px 20px;
font-size: 3pt;
color: #F7F5F2;
border-bottom: #D3CEC7 1px dashed;
}

/*----------------------------------------------------
footer
----------------------------------------------------------------*/

div#footer a, div#footer a:link, div#footer a:visited {
color: #8795A0;
padding: 10px;
text-decoration: none;
}

div#footer a:hover {
color: #AFB7BE;
text-decoration: none;
}

#footer {
width: auto;
padding: 10px 0px 10px 0px;
margin: -30px 205px 0px 0px;
z-index: 100;
text-align: left;
clear: both;
background-color: #67544D;
border-bottom: #67544A 1px solid;
}

li.viewing {
color: #B7AFA5;
padding: 10px;
}

ul.navfooter{
padding: 0px;
margin: 0px;
}

ul.navfooter li {
display: inline;
margin: 0px -3px 0 0px;
}

.clearfoot {
clear: both;
}
/*----------------------------------------------------
Archive Pages
----------------------------------------------------------------*/

ul.year {
text-align: center;
padding: 20px;
}

ul.year li {
display: inline;

}

table.yeartable {
margin-left: auto;
margin-right: auto;
padding: 0px;
}

table.yeartable td.yeardate, table.yeartable td.yearday {
background-color: #EFEBE6;
text-align: center;
padding: 5px;
color: #B7AFA5;
}

table.yeartable td.yearday {
text-align: center;
padding: 5px;
background-color: #8E6164;
color: #eeeeee;
}

td.yearmonth {

border-style: none;
}

/*----------------------------------------------------
Comments pages
----------------------------------------------------------------*/

.datesubjectcomment {
padding: 5px;
margin-top: 10px;
color: #908C85;
font-size: 7pt;
font-family: "trebuchet", sans-serif;
}

.userpiccomment {
position: relative;
margin: 30px 5px 5px 10px;
z-index: 15;
float: right;
height: 70px;
width: 70px;
}

.box {
background-color: #F7F5F2;
margin: 0px 0px 10px 0px;
padding: 10px 30px 20px 30px;
clear: left;
color: #908C85;
}

input, textarea {
border: #EFEBE6 1px solid;
background-color: #F7F5F2;
color: #908C85;
font-size: 8pt;
}

textarea.textbox {
width: 90% !important;
font-size: 8pt;
}

.reply {
position: relative;
text-align: left;
background-color: #F7F5F2;
color: #908C85;
}

.replytosubject {
font-weight: bold;
}

.commentreply {
padding: 25px 20px 45px 20px;
position: justify;
color: #908C85;
font-family: "trebuchet", sans-serif;
font-size: 8pt;
text-align: justify;
border: #EFEBE6 1px solid;
}

.commentbox {
margin-top: 5px;
padding: 0px;
background-color: #F7F5F2;
}

.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #8595A2;
letter-spacing: 1px;
}

.datesubjectcomment a:hover {
color: #8595A2;
}

.commentboxpartial {
padding: 10px;
margin: 10px;
background-color: #F7F5F2;
}

.commentinfo {
background-color: #F7F5F2;
margin-top: 0px;
width: 100%;
}

/*--------------------------------------------
Misc
-----------------------------------------*/

.skiplinks {
text-align: center;
margin: -5px 20px -15px 20px;
padding: 5px;
color: #F7F5F2;
background-color: #F7F5F2;
border: #EFEBE6 1px solid;
}

.skiplinks a, .skiplinks a:link, skiplinks a:visited {
color: #B7AFA5;
}

.skiplinks a:hover {
color: #A5983F;
}

.clear {
height: 15px;
}

NOTE
*THIS LAYOUT IS NOT FULLY COMPATIBLE WITH INTERNET EXPLORER. I apologize, but I've tried and tried to fix it but nothing seems to work *angsts*

Installation Instructions
1. Under customize css, set all the drop down boxes to no.
2. To add a header, find background-image:url(); under .headerimage in the css and add your image url between the brackets. Also make sure to change the dimensions of the width and height (width: 800px; height: 0px;) to whatever size your image is.
3. Feel free to edit the css as much as you want, but if you mess up don't ask me to fix it.
4. Please credit biconic if you use :)

If there are any bugs or if you have any problems feel free to leave a comment and I'll get to it as soon as I can.