/*
Rampaging Mutant Penguins - Graphical Stylesheet
Creator: Ben "Cerbera" Millard (http://sitesurgeon.co.uk)
Website: http://projectcerbera.com/!dev/accessify/rmp/rampaging-mutant-penguins
History: 2005-12-23 -> 2005-12-24, 2012-06-20
*/


/* Override Default Browser Styles */
html {
 margin: 0;
 padding: 0;
 font: 100% Helvetica,sans-serif;
}
body {
 margin: 0;
 padding: 0 0 0.5em 0;
 color: #000;
 font-size: 0.75em;
 background: #cdd;
}
h1, h2, h3 {
 margin: 1em 0 0 0;
 color: #357;
 font-variant: small-caps;
 background: inherit;
}
h1 {
 font-size: 2em;
 letter-spacing: -0.021em; /* 0.5px */
}
h2 {
 font-size: 1.5em;
}
h3 {
 font-size: 1.2em;
}
address {
 margin: 0 0 1em 0;
}
acronym, abbr {
 border-bottom: 1px dotted;
}
hr {
 display: none;
 visiblity: hidden;
}

/* Text Hyperlinks */
a:link {
 color: #458;
 background: inherit;
}
a:visited {
 color: #456;
 background: inherit;
}
a:hover, a:active, a:focus {
 color: #fff;
 background: #458;
 text-decoration: none;
}

/* Layout Containers */
#header {
 margin: 0;
 padding: 0.5em;
 color: #000;
 background: #cdd;
 border-bottom: 0.1em solid #000;
}
#container {
 clear: both;
 float: left;
 margin: 0;
 padding: 0 2% 0 0;
 width: 98%;
 color: #000;
 background: #fff;
}
#content {
 float: right;
 margin: 0;
 padding: 0;
 width: 78%;
}
#navigation {
 float: left;
 width: 20%;
 margin: 0;
 padding: 0;
 overflow: hidden;
 color: #000;
 background: #dae1e9;
 border-right: 0.1em solid #000;
 border-bottom: 0.1em solid #000;
}
#footer {
 clear: both;
 margin: 0;
 padding: 0;
 color: #000;
 background: #cdd;
 border-top: 0.1em solid #000;
}


/* Header Elements */
#header h1, #header p {
 margin: 0;
}
#header p#tagline {
 font-style: italic;
}

/* Content Elements */
blockquote {
 margin: 1em 0;
 padding: 0 1em;
 border: 1em solid #dae1e9;
 border-width: 0 1em;
}
blockquote address {
 text-align: right;
}
#content p {
 text-align: justify;
}
div.img {
 float: right;
 color: #000;
 margin: 0 0 1em 1em;
 padding: 0 0 0.25em 0;
 width: 250px;
 background: #dae1e9;
 border-top: 0.25em solid #dae1e9;
 border-left: 0.25em solid #bac1c9;
 border-right: 0.25em solid #7a8189;
 border-bottom: 0.25em solid #5a6169;
}
#content div.img p.caption {
 margin: 0;
 padding: 0.25em 0.5em;
 text-align: left;
 font-style: italic;
}

/* Navigation Elements */
#navigation h2, #navigation h3 {
 margin: 1em 0 0.2em 0.8em;
 padding: 0;
 font-size: 1.2em;
}
#navigation ul {
 margin: 0 1em 1em 1em;
 padding: 0;
 list-style-type: none;
 height: 1%;
}
#navigation li {
 margin: 0.25em 0;
 color: #eee;
 background: #184582;
}
#navigation a, #navigation li.current {
 margin: 0;
 padding: 0.25em 0 0.25em 0.5em;
 height: 1%;
 border: 0.125em solid;
 border-top-color: #ccc;
 border-left-color: #aaa;
 border-right-color: #444;
 border-bottom-color: #222;
}
#navigation li.current {
 color: #003;
 background: #fff;
}
#navigation a {
 display: block;
 text-decoration: none;
}
/* Navigation Hyperlinks */
#navigation a:link {
 color: #eee;
 background: #184582;
 border-top-color: #ccc;
 border-left-color: #aaa;
 border-right-color: #666;
 border-bottom-color: #444;
}
#navigation a:visited {
 color: #ddd;
 background: #184582;
 border-top-color: #ccc;
 border-left-color: #aaa;
 border-right-color: #666;
 border-bottom-color: #444;
}
#navigation a:hover, #navigation a:focus {
 color: #fff;
 background: #224;
 border-top-color: #bbb;
 border-left-color: #999;
 border-right-color: #222;
 border-bottom-color: #000;
}
#navigation a:active {
 color: #fff;
 background: #224;
 border-top-color: #000;
 border-left-color: #222;
 border-right-color: #999;
 border-bottom-color: #bbb;
}

/* Footer Elements */
#footer p {
 margin: 0.5em 0.5em 0 0.5em;
 text-align: justify;
}
#footer ul {
 margin: 0.5em 0 0.5em 0.5em;
 padding: 0;
 list-style-type: none;
}
#footer li {
 display: inline;
 padding: 0 0.5em 0 0.7em;
 border-left: 1px solid #456;
}
#footer li.first {
 padding-left: 0;
 border: 0;
}