ADDING A HEADER.

[etoileparjour]

journal preview
lepapillonbleu

style name flexible squares.
account type plus account.
problem/question okay, so i'm not a genius with layout css', but i like to think i have a basic gist of them. i mean, i've added headers and such before but this layout doesn't seem to like me; basically, i'm trying to put a header on the layout just above the dark brownish box (like here or invisibleforest) and i've been fiddling about with the css for about two hours now, editing out and in things and the only changes that have happened are that the dark brownish box goes to the header size or nothing happens at all. and i think it's time to ask for some help :3 any and all help will be greatly appreciated! <3


/*-------------------------------------------
name: vorona
original stylesheet by Katie @ http://knooqi.livejournal.com
style system: S2 //Flexible Squares
-------------------------------------------*/

body {
background-color: #0c0b0c;
background-image:url();
background-repeat: repeat;
text-align: center;
color: #38302b;
font-family: georgia;
font-size: 8pt;
margin-top: 20px;
}

a, a:link, a:visited, a:active {
color: #4FAECB;
cursor: default;
font-weight: 100;
text-decoration: none;
}

a:hover {
cursor: default;
color: #800427;
text-decoration: none;
}

b, i, s, u, emphasise, abbr, strong, strike, overline {
font-family: georgia;
font-style: italic;
font-weight: lighter;
font-size: 7pt;
color: #009ee0;
}

p, td {
font-size: 7pt;
}

h2 {
font-size: 12px;
color: #800427;
letter-spacing: -1pt;
text-align: center;
text-transform:lowercase;
font-weight: normal;
}

blockquote {
font-family: georgia;
background-color: #fafafa;
padding: 5px 5px 5px 5px;
margin: 5px;
border: 1px dashed;
border-color: #e6e6e6;
}

ul li, ol li, li {
padding-left: 5px;
margin-left: 0px;
list-style-position: outside;
}

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

/*-------------------------------------------
General Page
-------------------------------------------*/

#content
{
margin-top: 30px;
width: 600px;
margin: auto;
background-color: #e6e6e6;
padding-top: 15px;
text-align: justify;
}

#maincontent {
margin-top: 30px;
font-family: georgia;
font-size: 7pt;
background-color: #f6f6f6;
color: #A5A5A5;
text-align: justify;
}

#sidebar {
display: none;
}

#header {
text-align:center;
color:#808080;
font-size:7pt;
text-transform:lowercase;
padding: 40px;
background: #1d1916;
}

/*
look and color of links (also partly for footer)
-------------------------------------------*/

div#header a, div#header a:link, div#header a:visited {
position: relative;
font-family: georgia;
font-size: 6pt;
letter-spacing: 1pt;
text-transform: lowercase;
color: #800427;
text-align: right;
margin-right: 70px;
display: block;
}

div#header a:hover {
position: relative;
font-family: georgia;
font-size: 6pt;
text-transform: lowercase;
letter-spacing: 1pt;
color: #800427;
text-decoration: none;
text-align: right;
margin-right: 70px;
display: block;
}

div#footer a, div#footer a:link, div#footer a:visited {
font-family: georgia;
letter-spacing: -1pt;
font-size: 7pt;
text-transform: lowercase;
color: #800427;
text-align: right;
display: inline;
}

div#footer a:hover {
font-family: georgia;
font-size: 7pt;
letter-spacing: -1pt;
text-transform: lowercase;
color: #800427;
text-decoration: none;
text-align: right;
display: inline;
}

/*
title and subtitle
-------------------------------------------*/
.title {
display: none;
}

.subtitle{
display: none;
}

/*-------------------------------------------
Header
-------------------------------------------*/

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

ul.navheader
{
font-size: 6pt;
text-transform: lowercase;
padding: 0px;
letter-spacing: 1pt;
display: block;
text-align: right;
margin-right: 200px;
}

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

}

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

.subcontent {
}

.entry {
margin: 0px 10px 10px 30px;
padding: 10px;
background-color: #f6f6f6;
color: #A5A5A5;
font-family: georgia;
font-size: 7pt;
text-align: justify;
}

.entry_text {
text-align: justify;
}

.userpic {
position: relative;
float: right;
background-color: #f6f6f6;
color: #f6f6f6;
padding: 5px;
margin: 7px;
z-index: 15;
}

.userpic img, .userpicfriends img {
border-width: 1px;
border-style: dashed;
border-color: #e6e6e6;
background:#fff;
padding:6px;
}

.date {
line-height: 200%;
text-align: left;
margin-left: 35px;
top: 5px;
color: #C1C1C1;
font-family: georgia;
font-size: 7pt;
text-transform: lowercase;
}

.subject {
text-transform: lowercase;
font-weight: normal;
margin-left: 25px;
padding-left: 10px;
text-align: left;
background-color: #f6f6f6;
letter-spacing: -1pt;
font-style: italic;
border-bottom: 1px dashed;
border-color: #e6e6e6;
font-family: georgia;
color: #393639;
font-size: 11pt;
}

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

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

.datesubject {
background-color: #f6f6f6;
padding: 5px;
}

.entry ul li
{
padding: 0px;
margin: 0px 0px 0px 15px;
}

.entry ol li
{
padding: 0px;
margin: 0px 0px 0px 15px;
}

/*Entry | the look of the tags in entries
-------------------------------------------*/

.ljtags {
display: none;
}

/* Entry | Current Mood, Music and Location
-------------------------------------------*/
.currents strong {
font-weight: normal;
text-transform: lowercase;
color: #cdcdcd;
}

.currents, .currentmusic, .currentlocation {
padding-top: 5px;
font-family: georgia;
text-transform: lowercase;
font-size: 7pt;
}

.currentmood {
}

/* Entry | Comments
-------------------------------------------*/

.comments, div.comments a:hover, div.comments a, div.comments a:link, div.comments a:visited{
font-family: georgia;
font-size: 7pt;
letter-spacing: -1pt;
text-align: right;
font-style: italic;
text-transform: lowercase;
background-color: #f6f6f6;
padding: 0px 5px 0px 5px;
position: relative;
}

/* Entry | Separator
-------------------------------------------*/

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

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

.userpicfriends {
font-family: tahoma, verdana, sans-serif !important;
color: #DCDCDC !important;
position: relative;
float: right;
background-color: transparent !important;
padding: 5px;
margin: 7px;
z-index: 15;
text-align: center;
}

/*-------------------------------------------
Footer
-------------------------------------------*/

#footer {
width: 100%;
height: 30px;
text-align: center;
letter-spacing: -1pt;
font-family: georgia;
font-size: 7pt;
font-weight: normal;
background: #1d1916;
color: #4b4b4b;
clear: both;
}

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

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

.clearfoot {
clear: both;
background: transparent;
}

/*-------------------------------------------
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: dashed;
border-color: #D1D1D1;
}

table.yeartable td.yearday {
color: #DCDCDC;
background-color: #f6f6f6;
text-align: center;
}

td.yearmonth {
border-style: none;
}

/*-------------------------------------------
Comments Pages
-------------------------------------------*/

.datesubjectcomment {
background-color: #f6f6f6;
color: #dcdcdc;
border-width: 0px 0px 1px 0px;
border-style: dashed;
border-color: #e6e6e6;
padding: 5px;
margin-top: 20px;
}

.userpiccomment {
position: relative;
border-width: 1px;
border-style: dashed;
border-color: #e6e6e6;
background:#fff;
padding:6px;
top: -30px;
left: 0px;
margin: 10px 10px -20px 10px;
z-index: 15;
float: right;
}

.box {
border-style: dashed;
border-width: 1px;
border-color: #EEEEEE;
padding: 10px;
clear: left;
}

input, textarea, select {
border: 1px solid #ffffff;
background-color: #f6f6f6;
font-family: georgia;
color: #A5A5A5;
font-size: 7pt;
}

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

.reply {
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: georgia;
font-size: 7pt;
line-height: 125%;
background-color: #f6f6f6;
color: #A5A5A5;
}

.replytosubject {
font-weight: bold;
}

.commentreply {
position: relative;
margin: 10px;
font-size: 7pt;
font-family: georgia;
color: #A5A5A5;
}

.commentbox {
border-color: #FFFFFF;
border-width: 0px;
border-style: solid;
padding: 10px;
margin: 10px;
background-color: #f6f6f6;
}

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

.datesubjectcomment a:hover {
color: #DCDCDC;
}

.commentboxpartial {
border-color: #e6e6e6;
border-width: 1px;
border-style: dashed;
padding: 10px;
margin: 10px;
background-color: #f6f6f6;
}

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

.skiplinks {
text-align: center;
}

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

.clear {
height: 15px;
}

/*-------------------------------------------
Contextual Popup
-------------------------------------------*/

div.ContextualPopup {
position: relative;
margin: 5px 0 0 20px;
font: italic 10px georgia!important;
letter-spacing: -1px;
text-transform: lowercase;
}

div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:visited {
text-decoration: underline !important;
font-size: 10px;
font-weight: normal;
color: #800427 !important;
}

div.ContextualPopup img {
border: 0px;
}

div.ContextualPopup div.Inner {
position: relative;
top: -2px;
left: -2px;
background-color: #f9f7f7 !important;
color: #c1c1c1 !important;
border: 1px dotted #c1c1c1;
padding: 0px;
width: 20em;
}

div.ContextualPopup .Content {
padding: 10px;
margin: 4px 59px 4px 4px;
background:#f2f1f1;
}

/*-------------------------------------------
Pixel Icons
-------------------------------------------*/

/* icon for users */
.ljuser img[src="http://stat.livejournal.com/img/userinfo.gif"] {
display: none;
}

/* icon for communities */
.ljuser img[src="http://stat.livejournal.com/img/community.gif"] {
width:0;
height: 0;
background-repeat: no-repeat;
background-image: url(http://img.photobucket.com/albums/v173/SweetMissKat/livej/pixel_icons/tags.gif) !important;
padding: 10px 10px 0 0 !important;
}

/* icon for protected entries */
.subject img[src="http://stat.livejournal.com/img/icon_protected.gif"]{
width: 0;
height: 0;
background-repeat: no-repeat;
background-image: url(http://img.photobucket.com/albums/v173/SweetMissKat/livej/pixel_icons/lockie.gif);
padding: 8px 10px 0 0 !important;
}

/* icon for private entries */
.subject img[src="http://stat.livejournal.com/img/icon_private.gif"]{
width: 0;
height: 0;
background-repeat: no-repeat;
background-image: url(http://img.photobucket.com/albums/v173/SweetMissKat/livej/pixel_icons/lockie.gif);
padding: 8px 10px 0 0 !important;
}