Block links in the navigation header - SOLVED
Essentially what I want to do with my navigation links in the header is that I want the background colour to change when you hover over them, I believe this is called a block effect. Basically, I want my links to look similar to this layout.
- Basic Account
- Firefox 2.0
- Theme: Mixit
- Journal being modified: fruitsdemer
I'm trying to add modifications to a layout provided by thefulcrum, which can be found here.
/* Template: (#25) Your Biggest Flan v. Regular Width */
/* Date: March 4, 2007 */
/* S2 Style: Mixit */
/* Available at http://community.livejournal.com/thefulcrum/ */
/* Made by Liz a.k.a. grrliz.livejournal.com */
/* -------------------------------------------------------- */
/* ---------- ADD YOUR HEADER GRAPHIC BELOW --------------- */
/* -------------------------------------------------------- */
#header {position: relative; height: 40px; top center no-repeat;}
/*
- make sure that your height is the height of your graphic plus 40px
- e.g. if your graphic is 350px, your height should be 390px
*/
/* -------------------------------------------------------- */
/* ---------- ADD YOUR HEADER GRAPHIC ABOVE --------------- */
/* -------------------------------------------------------- */
html {margin: 0px; padding: 0px; font-size: 100%; /* IE hack */ }
body {
margin: 0px;
padding: 0px;
background: #dddddd;
color: #333333;
background-image:
url('http://colourlovers.com.s3.amazonaws.com/images/patterns/74/74475.png');
background-repeat: repeat;
background-attachment: fixed;
font-family: "trebuchet ms", tahoma, verdana, arial, sans-serif;
font-size: 62.5%;
text-align: center;
}
a, a:link, a:visited, a:active {color: #06384F; text-decoration: none;}
a:hover {color: #333333; text-decoration: underline;}
p {margin-top: 0.8em; margin-bottom: 0.8em;}
blockquote {margin: 0.8em 3em; padding: 1.63em; border: 1px dashed #bbbbbb; background: #F3F3DE;}
input, textarea, select {}
/* ----------------------------------------- */
/* ---------- PAGE STRUCTURE --------------- */
/* ----------------------------------------- */
/* -- don't touch the stuff below -- */
#page, #header, #content, #footer {position: relative; top: 0;}
#alpha, #beta, #gamma {display: inline; float: left; position: relative; top: 0;}
#footer {margin: -1px 0 0 0; /* HACK - removes space between content and footer */}
#page-inner, #header-inner, #content-inner, #alpha-inner, #beta-inner, #gamma-inner, #footer-inner {position: static;}
#header-inner, #alpha-inner, #beta-inner, #gamma-inner {overflow: hidden; /* hide content that is larger than the element dimensions */}
#alpha-inner[id] { overflow: visible; } /* FF MAC & PC will clip pager-top when accessing page anchor */
/* -- don't touch the stuff above -- */
#container {position: relative; margin: 0px auto; padding: 20px; font-size: 1.2em; line-height: 1.8em; text-align: left;}
#container-inner {min-height: 100%; text-align: left;}
#page {width: 700px; margin: 0px auto; padding: 0px; border: 1px solid #bbbbbb; background: #ffffff;}
#header-inner {margin: 0px auto;}
#content {text-align: left;}
#alpha {width: 700px;}
.layout-tw #alpha {float: right;}
#alpha-inner {margin: 0 20px;}
#beta {width: 200px;}
.layout-wt #beta-inner {padding: 1.8em 20px 20px 0px}
.layout-tw #beta-inner {padding: 1.8em 0px 20px 20px}
.lj-view-archive #alpha-inner,
.lj-view-month #alpha-inner,
.lj-view-tags #alpha-inner {padding-top: 20px; padding-bottom: 20px;}
/* ---------------------------- */
/* ---------- HEADER ---------- */
/* ---------------------------- */
#header-content {overflow: hidden; text-transform: uppercase; text-align: right;}
#header-text ul.nav {position: absolute; bottom: 0px; left: 0px; width: 700px; height: 40px; line-height: 40px; margin: 0px; padding: 0px; border-top: 1px dashed #bbbbbb; border-bottom: 1px dashed #bbbbbb; background: #ecefe4; text-transform: lowercase; }
#header-text ul.nav li {margin: 0px; padding: 0 0.9em; display: inline;}
#header-text ul.nav li.item {border: 0px;}
#header-text ul.nav a {color: #000000; font-size: 1.4em; text-decoration: none;}
#header-text ul.nav a:hover {color: #FFFFFF;}
#header-name {display: none; margin: 0px auto; padding: 1.2em 0; font-size: 2em; letter-spacing: 0.1em;}
#header-name a {color: #06384F; text-decoration: none;}
#header-name a:hover {color: #333333;}
#header-description {display: none; margin: 0px auto; }
/* ----------------------------- */
/* ---------- ENTRIES ---------- */
/* ----------------------------- */
/* previous and next links */
.stream-header {display: none; padding: 10px 20px; text-align: center;}
.stream-footer {padding: 0px; text-align: center;}
/* entry container */
.asset {margin: 0px; padding: 0px 0px 13px 0px; border-bottom: 1px dashed #bbbbbb;}
.asset-inner {padding: 0 0 1.8em 0; }
.asset-header {padding: 1.8em 0 0.9em 0;}
.lj-view-entry .asset-header {padding: 0; }
/* entry subject */
h2.page-header2 {margin: 0px; padding: 0.2em 0; font-size: 2em; font-weight: normal;}
h2.page-header2 a, .lj-view-tags h2 {color: #06384F; text-decoration: none;}
h2.page-header2 a:hover {color: #333333;}
abbr.datetime {
margin: 0px; padding: 0px;
list-style-type: none;
color: #666666;
font-size: 1em;
text-transform: uppercase;
text-align: right;
}
/* entry body, meta, tags */
.asset-content {margin-bottom: 0.9em; padding-bottom: 0.9em; }
/* entry text */
.asset-body {padding: 0.9em 0;}
.asset-body a {color: #06384F; font-weight: bold; border-bottom: 1px dashed #bbbbbb; text-decoration: none;}
.asset-body a:hover {color: #333333;}
.asset-body dt {border-bottom: 1px dashed #bbbbbb; font-weight: bold;}
.asset-body dd {margin-left: 3.6em; padding: 10px; background: #F3F3DE; border: 1px dashed #bbbbbb; border-top: 0px; }
/* date and time */
div.asset-header ul {margin: 0px !important; padding: 0px !important;}
div.asset-header li.item {padding: 0px;}
.ljuser {display: inline !important;}
/* userpic */
.user-icon {float: right; margin-left: 5px; padding: 1px; background: transparent !important; text-align: center;}
.user-icon img {border: 1px solid #D8D8D8;}
.user-icon span {background: #ffffff !important; text-align: center;}
/* mood, music, location */
.lj-currents ul {margin: 0px; padding: 0px;}
.lj-currents ul li {list-style: none;}
.lj-currents img {display: none;}
.entryMetadata-label {font-weight:bold;}
.entryMetadata-content {margin-left: 2px;}
/* --- tags --- */
.asset-tags-header {
display: block; float: left;
width: 3.5em; /* matches .asset-tags-content width */
height: 100% !important;
margin: 0px; padding: 0px;
font-size: 1em !important;
}
.asset-tags-list {margin: 0 0 0 3.5em; padding: 0px; list-style-type: none;}
.asset-tags-list li {display: inline; padding-right: 5px;}
.asset-tags-list a {white-space: normal !important;}
/* comments bar */
ul.asset-meta-list {clear: both; margin: 0px; padding: 0px; list-style-type: none;}
li.asset-meta-comments {display: inline; margin: 0px 10px 0px 0px;}
ul.asset-meta-list .item {border: 0px;}
.prevnext, .prev, .next {padding: 5px 0px;}
/* ----------------------------- */
/* ---------- SIDEBAR ---------- */
/* ----------------------------- */
.widget {margin-bottom: 20px;}
.widget-inner {}
.widget-header {margin: 0px 0px 5px 0px; padding: 0px 0px 5px 0px; color: #06384F; border-bottom: 1px dashed #bbbbbb; font-size: 1.3em; text-transform: uppercase;}
.widget-content {margin: 0px; padding: 0px;}
.widget ul {margin: 0px; padding: 0px 0px 0px 20px;}
.widget a {color: #333333;}
.widget a:hover {color: #06384F; text-decoration: none;}
/* profile */
.about-me-widget {display: none; text-align: center;}
.about-me-widget .widget-header a {color: #333333;}
.about-me-widget .widget-header a:hover {color: #bbbbbb;}
.about-me-widget dl, .about-me-widget dd, .about-me-widget dt {margin: 0px; padding: 0px; width: 100%;}
/* calendar */
.calendar-widget {}
.calendar-widget table {width: 100%; text-align: center;}
.calendar-widget p {margin: 5px 0px; padding: 0px; text-align: center;}
.calendar-widget tr:first-child a {background: #ffffff; border: 0px;}
.calendar-widget td a {display: block; width: 100%; color: #06384F; background: #F3F3DE; border: 1px solid #bbbbbb;}
/* link list */
.typelist-widget li.item {margin: 0px; padding: 0px; }
/* tags */
.categories-widget .widget-footer {padding: 20px 0px 0px 0px;}
.categories-widget li.item {margin: 0px; padding: 0px;}
.categories-widget li.tag {display: inline; padding: 0px 1px; background: none; }
/* post summary */
.archive-widget li.item {margin: 0px 0px 5px 0px; padding: 0px;}
.links-widget .widget-list .item {
margin-bottom: .2em;
border: none !important;
}
.widget-list .tagcloud {
list-style: none !important;
display: inline !important;
color: #ff0000 !important;
white-space: nowrap !important;
border-left: 0 !important;
width: 100% !important;
}
/* syndication, LiveJournal link, designer link */
.syndicate-widget,
.powered-widget,
.designed-widget {display: none;}
/* ----------------------------------- */
/* ---------- COMMENTS PAGE ---------- */
/* ----------------------------------- */
/* Comments ---------------------------------------*/
#comments {padding: 0px;}
div.comments-inner h2 {margin: 0px; padding: 1.5em 0 0 0; color: #06384F; font-size: 2em; font-weight: normal;}
.comment {margin-bottom: 1.8em; padding: 0.9em 0; border-bottom: 1px dashed #bbbbbb;}
.comment-odd {}
.comment-even {background: #ffffff;}
.comments-nav {margin: 20px; text-align:center;}
/* --- reply, freeze, screen, etc --- */
.comment-links {margin-top: 0.9em; font-weight: normal; text-align: right; font-size: 1em;}
.comment-subject {font-weight: bold; }
.comment-date {margin-top: 0.9em; margin-bottom: 0.9em;}
/* Fix height in IE */
.comment {height: 1%;}
/* Quick Reply ---------------------------------------*/
.quickreply {margin-top: 1em; width:90%; padding-top: 5px; padding-bottom: 10px;}
#commenttext, #subject {width: 90%;}
#comment-form {width: 500px;}
/* ------------------------------ */
/* ---------- ARCHIVES ---------- */
/* ------------------------------ */
/* Calendar/Archive ---------------------------------------------------------------------- */
ul.year {text-align: center; padding: 0px;}
ul.year li {display: inline; padding: 0px 5px;}
table.yeartable {margin-left: auto; margin-right: auto;}
table.yeartable td.yeardate, table.yeartable td.yearday {border: 1px solid #bbbbbb;}
table.yeartable td.yearday {background-color: #F3F3DE; text-align: center;}
td.yearmonth {border-style: none; font-weight: bold;}
dd.viewsubjects {margin: 0 0 .75em .75em;}
.lj-view-month table {}
.lj-view-month widget table {margin: 0px !important;}
/* -------------------------- */
/* ---------- MISC ---------- */
/* -------------------------- */
/* Sponsored Plus ---------------------------------------*/
#ad-5linkunit {
clear: both;
}
#ad-leaderboard {
margin-bottom: 10px;
}
/* Utility Code --------------------------------------------------- */
/* clear floats, inspired by positioniseverything.net/easyclearing.html */
.comment-body:after,
#page-inner:after,
#header-inner:after,
#header-photo:after,
#content-inner:after,
#alpha-inner:after,
#beta-inner:after,
#gamma-inner:after,
#delta-inner:after,
#footer-inner:after,
.widget .user-pic:after {
content: ".";
display: block;
visibility: hidden;
clear: both;
height: 0.1px;
font-size: 0.1em;
line-height: 0.1px;
}
/* float in post bodies around enclosures */
#content-inner,
.asset-body {
height: 1%;
}
/* Win IE < 7 */
* html #header-name a { word-wrap: break-word; }
/* ----------------------------------------------------------------------- */
/* ---------- PLEASE PASTE ANY FURTHER CSS OVERRIDES BELOW HERE ---------- */
/* ----------------------------------------------------------------------- */
- Basic Account
- Firefox 2.0
- Theme: Mixit
- Journal being modified: fruitsdemer
I'm trying to add modifications to a layout provided by thefulcrum, which can be found here.
/* Template: (#25) Your Biggest Flan v. Regular Width */
/* Date: March 4, 2007 */
/* S2 Style: Mixit */
/* Available at http://community.livejournal.com/thefulcrum/ */
/* Made by Liz a.k.a. grrliz.livejournal.com */
/* -------------------------------------------------------- */
/* ---------- ADD YOUR HEADER GRAPHIC BELOW --------------- */
/* -------------------------------------------------------- */
#header {position: relative; height: 40px; top center no-repeat;}
/*
- make sure that your height is the height of your graphic plus 40px
- e.g. if your graphic is 350px, your height should be 390px
*/
/* -------------------------------------------------------- */
/* ---------- ADD YOUR HEADER GRAPHIC ABOVE --------------- */
/* -------------------------------------------------------- */
html {margin: 0px; padding: 0px; font-size: 100%; /* IE hack */ }
body {
margin: 0px;
padding: 0px;
background: #dddddd;
color: #333333;
background-image:
url('http://colourlovers.com.s3.amazonaws.com/images/patterns/74/74475.png');
background-repeat: repeat;
background-attachment: fixed;
font-family: "trebuchet ms", tahoma, verdana, arial, sans-serif;
font-size: 62.5%;
text-align: center;
}
a, a:link, a:visited, a:active {color: #06384F; text-decoration: none;}
a:hover {color: #333333; text-decoration: underline;}
p {margin-top: 0.8em; margin-bottom: 0.8em;}
blockquote {margin: 0.8em 3em; padding: 1.63em; border: 1px dashed #bbbbbb; background: #F3F3DE;}
input, textarea, select {}
/* ----------------------------------------- */
/* ---------- PAGE STRUCTURE --------------- */
/* ----------------------------------------- */
/* -- don't touch the stuff below -- */
#page, #header, #content, #footer {position: relative; top: 0;}
#alpha, #beta, #gamma {display: inline; float: left; position: relative; top: 0;}
#footer {margin: -1px 0 0 0; /* HACK - removes space between content and footer */}
#page-inner, #header-inner, #content-inner, #alpha-inner, #beta-inner, #gamma-inner, #footer-inner {position: static;}
#header-inner, #alpha-inner, #beta-inner, #gamma-inner {overflow: hidden; /* hide content that is larger than the element dimensions */}
#alpha-inner[id] { overflow: visible; } /* FF MAC & PC will clip pager-top when accessing page anchor */
/* -- don't touch the stuff above -- */
#container {position: relative; margin: 0px auto; padding: 20px; font-size: 1.2em; line-height: 1.8em; text-align: left;}
#container-inner {min-height: 100%; text-align: left;}
#page {width: 700px; margin: 0px auto; padding: 0px; border: 1px solid #bbbbbb; background: #ffffff;}
#header-inner {margin: 0px auto;}
#content {text-align: left;}
#alpha {width: 700px;}
.layout-tw #alpha {float: right;}
#alpha-inner {margin: 0 20px;}
#beta {width: 200px;}
.layout-wt #beta-inner {padding: 1.8em 20px 20px 0px}
.layout-tw #beta-inner {padding: 1.8em 0px 20px 20px}
.lj-view-archive #alpha-inner,
.lj-view-month #alpha-inner,
.lj-view-tags #alpha-inner {padding-top: 20px; padding-bottom: 20px;}
/* ---------------------------- */
/* ---------- HEADER ---------- */
/* ---------------------------- */
#header-content {overflow: hidden; text-transform: uppercase; text-align: right;}
#header-text ul.nav {position: absolute; bottom: 0px; left: 0px; width: 700px; height: 40px; line-height: 40px; margin: 0px; padding: 0px; border-top: 1px dashed #bbbbbb; border-bottom: 1px dashed #bbbbbb; background: #ecefe4; text-transform: lowercase; }
#header-text ul.nav li {margin: 0px; padding: 0 0.9em; display: inline;}
#header-text ul.nav li.item {border: 0px;}
#header-text ul.nav a {color: #000000; font-size: 1.4em; text-decoration: none;}
#header-text ul.nav a:hover {color: #FFFFFF;}
#header-name {display: none; margin: 0px auto; padding: 1.2em 0; font-size: 2em; letter-spacing: 0.1em;}
#header-name a {color: #06384F; text-decoration: none;}
#header-name a:hover {color: #333333;}
#header-description {display: none; margin: 0px auto; }
/* ----------------------------- */
/* ---------- ENTRIES ---------- */
/* ----------------------------- */
/* previous and next links */
.stream-header {display: none; padding: 10px 20px; text-align: center;}
.stream-footer {padding: 0px; text-align: center;}
/* entry container */
.asset {margin: 0px; padding: 0px 0px 13px 0px; border-bottom: 1px dashed #bbbbbb;}
.asset-inner {padding: 0 0 1.8em 0; }
.asset-header {padding: 1.8em 0 0.9em 0;}
.lj-view-entry .asset-header {padding: 0; }
/* entry subject */
h2.page-header2 {margin: 0px; padding: 0.2em 0; font-size: 2em; font-weight: normal;}
h2.page-header2 a, .lj-view-tags h2 {color: #06384F; text-decoration: none;}
h2.page-header2 a:hover {color: #333333;}
abbr.datetime {
margin: 0px; padding: 0px;
list-style-type: none;
color: #666666;
font-size: 1em;
text-transform: uppercase;
text-align: right;
}
/* entry body, meta, tags */
.asset-content {margin-bottom: 0.9em; padding-bottom: 0.9em; }
/* entry text */
.asset-body {padding: 0.9em 0;}
.asset-body a {color: #06384F; font-weight: bold; border-bottom: 1px dashed #bbbbbb; text-decoration: none;}
.asset-body a:hover {color: #333333;}
.asset-body dt {border-bottom: 1px dashed #bbbbbb; font-weight: bold;}
.asset-body dd {margin-left: 3.6em; padding: 10px; background: #F3F3DE; border: 1px dashed #bbbbbb; border-top: 0px; }
/* date and time */
div.asset-header ul {margin: 0px !important; padding: 0px !important;}
div.asset-header li.item {padding: 0px;}
.ljuser {display: inline !important;}
/* userpic */
.user-icon {float: right; margin-left: 5px; padding: 1px; background: transparent !important; text-align: center;}
.user-icon img {border: 1px solid #D8D8D8;}
.user-icon span {background: #ffffff !important; text-align: center;}
/* mood, music, location */
.lj-currents ul {margin: 0px; padding: 0px;}
.lj-currents ul li {list-style: none;}
.lj-currents img {display: none;}
.entryMetadata-label {font-weight:bold;}
.entryMetadata-content {margin-left: 2px;}
/* --- tags --- */
.asset-tags-header {
display: block; float: left;
width: 3.5em; /* matches .asset-tags-content width */
height: 100% !important;
margin: 0px; padding: 0px;
font-size: 1em !important;
}
.asset-tags-list {margin: 0 0 0 3.5em; padding: 0px; list-style-type: none;}
.asset-tags-list li {display: inline; padding-right: 5px;}
.asset-tags-list a {white-space: normal !important;}
/* comments bar */
ul.asset-meta-list {clear: both; margin: 0px; padding: 0px; list-style-type: none;}
li.asset-meta-comments {display: inline; margin: 0px 10px 0px 0px;}
ul.asset-meta-list .item {border: 0px;}
.prevnext, .prev, .next {padding: 5px 0px;}
/* ----------------------------- */
/* ---------- SIDEBAR ---------- */
/* ----------------------------- */
.widget {margin-bottom: 20px;}
.widget-inner {}
.widget-header {margin: 0px 0px 5px 0px; padding: 0px 0px 5px 0px; color: #06384F; border-bottom: 1px dashed #bbbbbb; font-size: 1.3em; text-transform: uppercase;}
.widget-content {margin: 0px; padding: 0px;}
.widget ul {margin: 0px; padding: 0px 0px 0px 20px;}
.widget a {color: #333333;}
.widget a:hover {color: #06384F; text-decoration: none;}
/* profile */
.about-me-widget {display: none; text-align: center;}
.about-me-widget .widget-header a {color: #333333;}
.about-me-widget .widget-header a:hover {color: #bbbbbb;}
.about-me-widget dl, .about-me-widget dd, .about-me-widget dt {margin: 0px; padding: 0px; width: 100%;}
/* calendar */
.calendar-widget {}
.calendar-widget table {width: 100%; text-align: center;}
.calendar-widget p {margin: 5px 0px; padding: 0px; text-align: center;}
.calendar-widget tr:first-child a {background: #ffffff; border: 0px;}
.calendar-widget td a {display: block; width: 100%; color: #06384F; background: #F3F3DE; border: 1px solid #bbbbbb;}
/* link list */
.typelist-widget li.item {margin: 0px; padding: 0px; }
/* tags */
.categories-widget .widget-footer {padding: 20px 0px 0px 0px;}
.categories-widget li.item {margin: 0px; padding: 0px;}
.categories-widget li.tag {display: inline; padding: 0px 1px; background: none; }
/* post summary */
.archive-widget li.item {margin: 0px 0px 5px 0px; padding: 0px;}
.links-widget .widget-list .item {
margin-bottom: .2em;
border: none !important;
}
.widget-list .tagcloud {
list-style: none !important;
display: inline !important;
color: #ff0000 !important;
white-space: nowrap !important;
border-left: 0 !important;
width: 100% !important;
}
/* syndication, LiveJournal link, designer link */
.syndicate-widget,
.powered-widget,
.designed-widget {display: none;}
/* ----------------------------------- */
/* ---------- COMMENTS PAGE ---------- */
/* ----------------------------------- */
/* Comments ---------------------------------------*/
#comments {padding: 0px;}
div.comments-inner h2 {margin: 0px; padding: 1.5em 0 0 0; color: #06384F; font-size: 2em; font-weight: normal;}
.comment {margin-bottom: 1.8em; padding: 0.9em 0; border-bottom: 1px dashed #bbbbbb;}
.comment-odd {}
.comment-even {background: #ffffff;}
.comments-nav {margin: 20px; text-align:center;}
/* --- reply, freeze, screen, etc --- */
.comment-links {margin-top: 0.9em; font-weight: normal; text-align: right; font-size: 1em;}
.comment-subject {font-weight: bold; }
.comment-date {margin-top: 0.9em; margin-bottom: 0.9em;}
/* Fix height in IE */
.comment {height: 1%;}
/* Quick Reply ---------------------------------------*/
.quickreply {margin-top: 1em; width:90%; padding-top: 5px; padding-bottom: 10px;}
#commenttext, #subject {width: 90%;}
#comment-form {width: 500px;}
/* ------------------------------ */
/* ---------- ARCHIVES ---------- */
/* ------------------------------ */
/* Calendar/Archive ---------------------------------------------------------------------- */
ul.year {text-align: center; padding: 0px;}
ul.year li {display: inline; padding: 0px 5px;}
table.yeartable {margin-left: auto; margin-right: auto;}
table.yeartable td.yeardate, table.yeartable td.yearday {border: 1px solid #bbbbbb;}
table.yeartable td.yearday {background-color: #F3F3DE; text-align: center;}
td.yearmonth {border-style: none; font-weight: bold;}
dd.viewsubjects {margin: 0 0 .75em .75em;}
.lj-view-month table {}
.lj-view-month widget table {margin: 0px !important;}
/* -------------------------- */
/* ---------- MISC ---------- */
/* -------------------------- */
/* Sponsored Plus ---------------------------------------*/
#ad-5linkunit {
clear: both;
}
#ad-leaderboard {
margin-bottom: 10px;
}
/* Utility Code --------------------------------------------------- */
/* clear floats, inspired by positioniseverything.net/easyclearing.html */
.comment-body:after,
#page-inner:after,
#header-inner:after,
#header-photo:after,
#content-inner:after,
#alpha-inner:after,
#beta-inner:after,
#gamma-inner:after,
#delta-inner:after,
#footer-inner:after,
.widget .user-pic:after {
content: ".";
display: block;
visibility: hidden;
clear: both;
height: 0.1px;
font-size: 0.1em;
line-height: 0.1px;
}
/* float in post bodies around enclosures */
#content-inner,
.asset-body {
height: 1%;
}
/* Win IE < 7 */
* html #header-name a { word-wrap: break-word; }
/* ----------------------------------------------------------------------- */
/* ---------- PLEASE PASTE ANY FURTHER CSS OVERRIDES BELOW HERE ---------- */
/* ----------------------------------------------------------------------- */