Flexible Squares - Ballads of the War

[midenianscholar]

Layout Style: Flexible Squares.
Best view: Safari and Firefox
Browser(s) Compatible: Firefox and Safari, but should work in all
Work with Nav bar?: Yes
Work with Ads? Yes.
Credit: scholarslayouts and wunderkind_lucy

Preview:



Live preview (with ads) at mslayout70 temporarily.

Congratulations wunderkind_lucy for her winning header! I felt bad about taking so long to get this up, so I tried to make it extra nice. :)


Feel free to play around with the layout, but please give me some form of credit.

It is preferred that you download the image to your own host! My links may disappear at any time.

Header.
Background.
Content Background.
Comment Background.
Input Background.

Overrides:

/* Cleaned CSS: */

/*---------------------------------------------------
This is the original stylesheet for the S2 style Flexible Squares with the elements
arranged in a hopefully clearer order.

You can find a full guide on the single css definitions, including exlanations and illustrations
at http://cartonage.livejournal.com.

Hope this helps! =)
-----------------------------------------------------*/

body {
background-color: #413e41;
text-align: center;
color: #4a311c;
font-family: "Georgia", sans-serif;
font-size: 13px;
margin: 20px 0 20px 0;
background-image:url(http://i407.photobucket.com/albums/pp157/scholarslayouts/civil%20war/background.png);
background-repeat:repeat;
}

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

a:hover {
color: #7a9092;
text-decoration: underline;
}

p, td, blockquote {
font-size: 11px;
}

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

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

#content
{
width: 768px;
margin-left: auto; margin-right: auto;
background-color: #e8d9c9;
border-width: 1px;
border-style: solid;
border-color: #e8d9c9;
padding: 15px;
background-image:url(http://i407.photobucket.com/albums/pp157/scholarslayouts/civil%20war/contentbackground.png);
background-repeat:repeat;
}

#maincontent {
margin-top: 15px;
font-family: "Georgia", sans-serif;
font-size: 13px;
background-color: transparent;
color: #9f6c48;
border-style: solid;
border-color: transparent;
border-width: 3px;
margin-right: 180px;
text-align: left;
}

#sidebar {

padding-top: 15px;
margin-top: 15px;
background-color: transparent;
border-color: transparent;
border-width: 3px;
border-style: solid;
font-size: 13px;
font-family: "Georgia", sans-serif;
color: #4a311c;
width: 167px;
float: right;
text-align: left;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}
/*-----------------------------------------------------------------------------
Header - you can add a header image with either #header or .headerimage
--------------------------------------------------------------------------------*/
#header {
width: 760px;
padding: 7px 0px 7px 0px;
margin: 0px;
text-align: center;
font-family: "Georgia", sans-serif;
font-size: 13px;
font-weight: bold;
letter-spacing: 3px;
border-style: solid;
border-color: transparent;
border-width: 10px;
background-color: transparent;
color: #7c8a7e;
}

.headerimage {
position: relative;
width: 800px;
height: 400px;
margin-left: auto;
margin-right: auto;
margin-bottom: 0px;
background-image: url("http://i407.photobucket.com/albums/pp157/scholarslayouts/civil%20war/scholarheader_002.png");
background-repeat: no-repeat;
}

/*look and color of links (also partly for
)*/
div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
color: #303a30;
}

div#header a:hover, div#footer a:hover {
color: #7a9092;
text-decoration: none;
}

/*title and subtitle*/
.title {
font-family: "Georgia", sans-serif;
font-size: 18px;
font-weight: normal;
line-height: 200%;
top: 10px;
color: #de9c44;
}

.subtitle{
font-family: "Georgia", sans-serif;
font-size: 13px;
font-weight: normal;
top: 10px;
color: #7c8a7e;
}

/*-----------------------------------------------------------------------------
Header - top navigation
--------------------------------------------------------------------------------*/

/* header -- links to views; title of journal; subtitle of journal */

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

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

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

.subcontent {
}

.entry {
margin: 0px 10px 10px 30px;
padding: 10px;
background-color: transparent;
color: #4a311c;
font-family: "Georgia", sans-serif;
font-size: 13px;
text-align: left;
border-width: 1px;
border-color: #de9c44;
border-style: solid;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
background-image:url(http://i407.photobucket.com/albums/pp157/scholarslayouts/civil%20war/contentbackground.png);
background-repeat:repeat;
}

.userpic {
position: relative;
float: left;
background-color: transparent;
padding: 5px;
margin: 10px;
z-index: 15;
border-width: 2px;
border-color: #de9c44;
border-style: solid;
}

.date {
line-height: 200%;
top: 5px;
color: #303a30;
font-family: "Georgia", sans-serif;
font-size: 10px;
background-color: transparent;
}

.subject {
font-weight: normal;
padding: 10px;
color: #7a9092;
font-family: "Georgia", sans-serif;
font-size: 35px;
letter-spacing: 5px;
background-color: transparent;
}

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

.subject a:hover {
color: #7a9092;
}

.datesubject {
background-color: transparent;
padding: 5px;
border-width: 10px;
border-color: transparent;
}

.entry ul li
{
padding-left: 5px;
margin-left: 15px;
}

.entry ol li
{
padding-left: 5px;
margin-left: 15px;
}

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

.currents, .currentmood, .currentmusic {
font-family: "Georgia", sans-serif;
font-size: 13px;
}

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

.comments {
font-family: "Georgia", sans-serif;
font-size: 13px;
text-align: right;
background-color: transparent;
padding: 0px 5px 0px 5px;
position: relative;
top: 15px;
background-image:url(http://i407.photobucket.com/albums/pp157/scholarslayouts/civil%20war/commentbackground.png);
background-repeat:repeat;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}

div.comments a, div.comments a:link, div.comments a:visited{
color: #e8d9c9;
font-weight: bold;
}

div.comments a:hover {
color: #7a9092;
text-decoration: bold;
}

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

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

/*------------------------------------------------------------
Special friends page customization
-------------------------------------------------------------------------------*/

.userpicfriends {
position: relative;
float: left;
background-color: transparent;
padding: 5px;
margin: 10px;
text-align: center;
border-style: dashed;
border-width: 1px;
border-color: transparent;
font-family: "Georgia", sans-serif;
font-size: 13px;
z-index: 15;
}

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

.defaultuserpic {
text-align: center;
}

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

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

.sbarbody2 {
padding: 0 15px 0 15px;
}

div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #303a30;
}

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

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

table.calendar {
margin-right: auto;
margin-left: auto;
}

.sbarcalendar {
border-color: #de9c44;
border-width: 1px;
border-style: solid;
text-align: center;
font-family: "Georgia", sans-serif;
font-size: 13px;
}

.sbarcalendarposts {
border-color: #de9c44;
border-width: 1px;
border-style: solid;
background-color: #f5d3ac;
text-align: center;
font-family: "Georgia", sans-serif;
font-size: 13px;
}

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

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

li.sbaritem
{
padding-left: 15px;
list-style: none;
}

li.sbartitle
{
padding-left: 15px;
list-style: none;
border-style: solid;
border-width: 2px;
border-color: transparent;
background-color: transparent;
margin-bottom: 10px;
margin-top: 10px;
text-align: center;
color: #e8d9c9;
background-image:url(http://i407.photobucket.com/albums/pp157/scholarslayouts/civil%20war/commentbackground.png);
background-repeat:repeat;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}

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

#footer {
width: 100%;
text-align: center;
font-family: "Georgia", sans-serif;
font-size: 13px;
font-weight: bold;
letter-spacing: 1px;
background-color: transparent;
color: #7c8a7e;
border-color: transparent;
border-width: 1px;
border-style: solid;
z-index: 100;
clear: both;
}

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

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

.clearfoot {
clear: both;
}

/*----------------------------------------------------
Archive Pages
----------------------------------------------------------------*/

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

ul.year li {
display: inline;
}

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

table.yeartable td.yeardate, table.yeartable td.yearday {
border-width: 1px;
border-style: solid;
border-color: #e8b694;
background-color: #e8b694;
color: #4a311c;
background-image:url(http://i407.photobucket.com/albums/pp157/scholarslayouts/civil%20war/contentbackground.png);
background-repeat:repeat;
}

table.yeartable td.yearday {
color: #4a311c;
text-align: center;
background-color: transparent;
border-color: transparent;
background-image:url(http://i407.photobucket.com/albums/pp157/scholarslayouts/civil%20war/commentbackground.png);
background-repeat:repeat;
}

td.yearmonth {
border-style: none;
}

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

.datesubjectcomment {
background-color: transparent;
padding: 5px;
margin-top: 20px;
background-image:url(http://i407.photobucket.com/albums/pp157/scholarslayouts/civil%20war/commentbackground.png);
background-repeat:repeat;
color: #4c2500;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}

.userpiccomment {
position: relative;
border-width: 1px;
border-style: solid;
border-color: #de9c44;
background-color: transparent;
top: -30px;
left: 0px;
padding: 5px;
margin: 10px 10px -20px 10px;
z-index: 15;
float: left;
}

.box {
border-style: solid;
border-width: 1px 0px 0px 0px;
border-color: transparent;
padding: 10px;
clear: left;
background-color: transparent;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
}

input, textarea {
background-color: transparent;
color: #4a311c;
background-image:url(http://i407.photobucket.com/albums/pp157/scholarslayouts/civil%20war/input.png);
background-repeat:repeat;
}

textarea.textbox {
width: 100% !important;
}

.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: "Georgia", sans-serif;
font-size: 13px;
line-height: 125%;
background-color: #fffbe9;
color: #4a311c;

}

.replytosubject {
font-weight: bold;
}

.commentreply {
position: relative;
margin: 10px;
font-size: 13px;
font-family: "Georgia", sans-serif;
color: #4a311c;
background-color: #fffbe9;
background-image:url(http://i407.photobucket.com/albums/pp157/scholarslayouts/civil%20war/contentbackground.png);
background-repeat:repeat;
}

.commentbox {

border-color: #de9c44;
border-width: 1px;
border-style: solid;
padding: 10px;
margin: 10px;
background-color: transparent;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
background-image:url(http://i407.photobucket.com/albums/pp157/scholarslayouts/civil%20war/contentbackground.png);
background-repeat:repeat;
}

.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #303a30;
}

.datesubjectcomment a:hover {
color: #7a9092;
}

.commentboxpartial {
border-color: transparent;
border-width: 2px;
border-style: solid;
padding: 10px;
margin: 10px;
background-color: transparent;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
background-image:url(http://i407.photobucket.com/albums/pp157/scholarslayouts/civil%20war/contentbackground.png);
background-repeat:repeat;
}

.commentinfo {
background-color: transparent;
margin-top: 10px;
width: 100%;
background-image:url(http://i407.photobucket.com/albums/pp157/scholarslayouts/civil%20war/contentbackground.png);
background-repeat:repeat;
}

.skiplinks {
text-align: center;
}

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

.clear {

height: 15px;
}

.ljtags {
margin-top: 25px;
}