Add styling elements.

3 files changed, 308 insertions, 0 deletions

diff --git a/butterfly.png b/butterfly.png
new file mode 100644
index 0000000..cf8478a
--- /dev/null
+++ b/butterfly.png
diff --git a/local.scss b/local.scss
new file mode 100644
index 0000000..64c94ad
--- /dev/null
+++ b/local.scss
@@ -0,0 +1,308 @@
+H1 {
+	margin-top: 1em;
+	margin-bottom: 1em;
+}
+
+H2,
+H3 {
+	margin-top: 1em;
+	margin-bottom: 0.1em;
+}
+
+H1,
+H2,
+H3,
+H4,
+H5,
+H6 {
+	color: #06c;
+}
+
+H2 {  
+	font-size:1.6em;
+}
+
+A {
+	color: #06c;
+	font-weight: normal;
+}
+
+A:hover {
+	color: #06c;
+}
+
+EM {
+	color: black;
+	font-style: normal;
+	font-weight: bold;
+}
+
+IMG.icon {
+	float: right;
+	height: 20%;
+	width: 20%;
+	margin-right: -30%;
+}
+
+body {
+/*	background-color: transparent;
+	background-image: url("pil.png");
+	background-repeat: no-repeat;
+	background-attachment: fixed;
+	background-position: right bottom;
+	margin: 0 0 100px 0;*/
+}
+
+DIV.header span {
+	display: none;
+}
+
+DIV.pageheader {
+	background-color: white;
+	height: 110px;
+	margin: 10px 0;
+}
+
+DIV#branding {
+	display: block;
+	height: 100px;
+	background-image: url(butterfly.png);
+	background-position: 45% 0;
+	background-repeat: no-repeat;
+}
+
+DIV#branding-logo {
+	position: absolute;
+	top: 75px;
+	right: 3%;
+}
+
+DIV#branding-tagline {
+	margin: 15px;
+}
+
+DIV#branding-tagline,
+DIV#branding-tagline A {
+	font-weight: bold;
+	font-size: 130%;
+}
+
+DIV.actions {
+	z-index: 1;
+	position: fixed;
+	bottom: 2em;
+}
+
+DIV.topbar {
+	float: right;
+	background-color: #9cf;
+	margin: 0;
+	padding: 0;
+	text-align: center;
+	width: 100%;
+}
+
+DIV.topbar a {
+	text-decoration: none;
+	color: #06c;
+	font-weight: bold;
+}
+
+DIV.topbar ul {
+	list-style-type: none;
+	padding: 0;
+	margin-top: 0;
+	margin-bottom: 0;
+	font-size: 1.2em;
+	font-weight: bold;
+	line-height: 2.5em;
+}
+
+DIV.topbar ul li {
+	display: inline;
+	color: #06c;
+	font-weight: bold;
+	margin: 0 4em 0 0;
+}
+
+DIV.topbar a:hover {
+	color: white;
+}
+
+DIV.topbar span.selflink {
+	color: white;
+}
+
+FORM#searchform {
+	display: block;
+	right: 15px;
+	margin: 0;
+	position: absolute;
+	top: 5px;
+}
+
+DIV#pagebody {
+	float: left;
+	width: 100%;
+}
+
+DIV#content {
+	margin: 2% 25% 15% 25%;
+	padding: 0;
+	max-width: 55em;
+}
+
+DIV.sidebar {
+	float: left;
+	border: none;
+	margin-top: 1em;
+	margin-left: -100%;
+	margin-right: 2%;
+	width: 17%;
+	padding: 0 0 0 1%;
+}
+
+DIV.sidebar UL {
+	margin: 0px;
+	padding: 0px;
+	text-transform: none;
+	font-weight: bold;
+}
+
+DIV.sidebar UL LI {
+	line-height: 2;
+	list-style-type: none;
+}
+
+DIV.sidebar UL LI SPAN.selflink {
+	color: #06c;
+}
+
+DIV.sidebar UL UL LI {
+	margin-left: 10%;
+}
+
+DIV.sidebar A {
+	text-decoration: none;
+	color: black;
+	font-weight: bold;
+}
+
+DIV.sidebar A:hover {
+	text-decoration: underline;
+	color: #06c;
+}
+
+DIV.sidebar DIV.notebox {
+	color: white !important;
+	background: #ff30ff;
+	border: none;
+	text-align: left;
+}
+
+/* TODO: drop when nn4.css is dropped */
+DIV.sidebar DIV.notebox p {
+	color: white;
+}
+
+DIV.sidebar DIV.notebox A {
+	color: inherit;
+}
+
+DIV.farbar {
+	float: left;
+	margin-top: 2%;
+	margin-left: -23%;
+	background: #99CCFF;
+	width: 20%;
+	max-width: 300px;
+	padding: 1%;
+}
+
+DIV.farbar H2 {
+	color: black;
+	margin-top: 0;
+}
+
+DIV.notebox {
+	float: none;
+	width: 100%;
+	color: #06c !important;
+	background: none;
+	margin-left: 0;
+	border: medium dashed #9cf;
+	text-align: center;
+}
+
+/* TODO: drop when nn4.css is dropped */
+DIV.notebox p {
+	color: #06c;
+	text-align: center;
+}
+
+DIV.inlinepage {
+	color: lightblue;
+	margin: 1em 0;
+	border: 0;
+	border-style: none none solid;
+	border-width: 1px;
+	padding: 1em 0;
+	overflow: visible;
+	min-height: 12em;
+}
+
+DIV.inlinepage DIV.inlinepage {
+	margin: 0;
+	padding: 0;
+	border-style: 0;
+	border-width: 0;
+}
+
+DIV.inlinepage IMG.icon {
+	margin-right: 0;
+	padding: 1%;
+	height: 15%;
+	width: 15%;
+}
+
+DIV.inlinepage DIV.inlinepage DIV.inlineheader,
+DIV.inlinefooter {
+	display: none;
+}
+
+div#footer{
+	width:100%
+}
+div#pageinfo {
+	position: fixed;
+	bottom: 0;
+	width: 100%;
+	border-top: 0;
+	padding: 1em 1em 1em 20px;
+	margin: 15px 0 0 0;
+	color: white;
+	background-color: #9cf;
+}
+
+DIV.tags {
+	display: none;
+}
+
+div#backlinks {
+	display: none;
+}
+
+DIV.pageheader div.actions ul {
+	border-bottom: 0;
+	padding: 7px 1.4em;
+}
+
+DIV.pagedate {
+	margin-top: 0;
+}
+
+DIV.pagecopyright,
+DIV.pagecopyright P {
+	margin-top: 0;
+	margin-bottom: 1em;
+}
diff --git a/pil.png b/pil.png
new file mode 100644
index 0000000..2f8b32f
--- /dev/null
+++ b/pil.png