added Funkfeuer CI based style

6 files changed, 242 insertions, 4 deletions

diff --git a/css/ffci.css b/css/ffci.css
new file mode 100644
index 0000000..59bc092
--- /dev/null
+++ b/css/ffci.css
@@ -0,0 +1,234 @@
+body {
+  background-color: white;
+  color: black;
+  margin: 0;
+  padding: 0;
+  font-family: "PT Sans", Helvetica, Arial;
+}
+body, p {
+  line-height: 1.4em;
+}
+
+
+div#header {
+  padding: 0;
+  margin: 0;
+  border: 0;
+  border-top: 28px solid white;
+  background-color: white;
+  background-image: url("../images/headerff.jpg");
+  background-repeat: no-repeat;
+  background-position: 42px 0;
+  height: 164px;
+}
+div#header img {
+  display: block;
+  padding: 0;
+  margin: 0;
+  border: 0;
+}
+
+
+div#links {
+  background-color: white;
+  margin: 1em 0 0 0;
+  padding: 0;
+}
+div#links ul {
+  margin: 0 0 0 2em;
+  padding: 0;
+  border: 0;
+}
+div#links li {
+  border-bottom: 1px solid #273142;
+  margin: 0;
+  padding: 0.15em 2em;
+  display: block;
+  float: left;
+  text-align: center;
+}
+div#links a {
+  color: #273142 ;
+  text-decoration: none;
+  font-weight: bold;
+  font-size: 11pt;
+}
+div#links a:hover {
+  color: #6991AA;
+}
+div#links ul#lang li {
+  padding: 0.15em 0.15em;
+  margin: 0;
+  border: 0;
+  font-size: 11pt;
+}
+div#links ul#lang li:first-child {
+  padding-left: 1.5em;
+}
+div#links ul#lang li img {
+  max-height: 39px;
+  height: 1.25em;
+  border: 0;
+  padding: 0 1px;
+  margin: 0;
+}
+
+
+div#navigation {
+  vertical-align: top;
+  background-color: white;
+  padding: 0;
+  margin: 1em 0 1em 1.5em;
+  width: 20%; 
+  max-width: 15em;
+  min-width: 10em;
+  float: left;
+}
+div#navigation h1 {
+  color: #273142;
+  font-size: 10pt;
+  text-align: right;
+  background-color: white;
+  background-image: url("../images/mascotte.png");
+  background-repeat: no-repeat;
+  background-position: left bottom;
+  margin: 0;
+  padding: 2.5em 0.5em 0.5em 0.5em;
+}
+div#navigation ul {
+  padding: 0;
+  margin: 0;
+  border: 0;
+  list-style: none;
+}	
+div#navigation li {
+  padding: 0.15em 1em;
+  margin: 0;
+  border: 0;
+  border-bottom: 1px solid white;
+}
+div#navigation a {
+  color: #273142;
+  text-decoration: none;
+  font-weight: bold;
+  font-size: 11pt;
+}
+div#navigation a:hover {
+  color: #6991AA;
+}
+
+
+div#content {
+  max-width: 50em;
+  min-width: 10em;
+  width: 45%;
+  float: left;
+  vertical-align: top;
+  margin: 1.4em 1em 1.4em 0.5em;
+  padding: 1em 3em 3em 3em;
+}
+div#content h1 {
+  margin: 2em 0 1.4em 0;
+  font-size: 2em;
+  line-height: 1.1em;
+}
+div#content h1:first-child {
+  margin: 0.5em 0 1.4em 0;
+}
+div#content h1 span.date {
+  font-size: 0.5em;
+  font-weight: normal;
+  line-height: 1em;
+}
+div#content h2 {
+  margin-top: 2em;
+  font-size: 1em;
+}
+div#content a {
+  color: #6991AA;
+  text-decoration: none;
+}
+div#content a:hover {
+  color: #273142;
+  text-decoration: underline;
+}
+div#content a:active {
+  color: #A1C820;
+}
+div#content p {
+  margin: 1.4em 0 1.4em 0;
+}
+div#content p img {
+  float:left;
+  padding-right: 1em;
+  border: 0;
+}
+
+
+div#meetup {
+  background-color: #556270;
+  padding: 0.25em 2em;
+  font-size: 0.9em;
+  width: 25em;
+}
+div#meetup p {
+  padding: 0;
+  margin: 0.5em 0 0.5em 0;
+  border: 0;
+}
+div#meetup h1:first-child {
+  font-size: 1.2em;
+  padding: 0;
+  margin: 0.5em 0 1em 0;
+  border: 0;
+}
+div#meetup ul {
+  padding: 0 0 0 2em;
+  margin: 0;
+  border: 0;
+}
+div#meetup em {
+  font-size: 1.2em;
+  font-weight: bold;
+  font-style: normal;
+}
+
+
+div.infobox {
+  background-color: #556270;
+  padding: 0.25em 2em;
+}
+
+
+div#footer {
+  background-color: #556270;
+  border-top: 1px solid black;
+  width: 100%;
+  margin-left: auto;
+  margin-right: auto;
+  text-align: center;
+  font-size: 9pt;
+  clear: both;
+}
+div#footer a {
+  color: #273142;
+  text-decoration: none;
+  font-weight: bold;
+}
+div#footer a:hover {
+  color: white;
+}
+div#footer img {
+  border: 0px;
+  padding: 0.5em;
+}
+div#htmlcss {
+  margin: 0;
+  margin-left: 0.5em;
+  float: left;
+}
+div#sponsor {
+  margin: 0;
+  margin-right: 0.5em;
+  float: right;
+}
diff --git a/css/ffgraz.css b/css/ffgraz.css
index 535d15b..8a9e2b0 100644
--- a/css/ffgraz.css
+++ b/css/ffgraz.css
@@ -16,7 +16,7 @@ div#header {
   border: 0;
   border-top: 28px solid #F8EB14;
   background-color: #F8EB14;
-  background-image: url("/images/ffgraz-bg.png");
+  background-image: url("../images/ffgraz-bg.png");
   background-position: left bottom;
   height: 145px;
 }
diff --git a/images/headerff.jpg b/images/headerff.jpg
new file mode 100644
index 0000000..02e87c8
--- /dev/null
+++ b/images/headerff.jpg
diff --git a/images/mascotte.png b/images/mascotte.png
new file mode 100644
index 0000000..5ab12f7
--- /dev/null
+++ b/images/mascotte.png
diff --git a/inc/header.html b/inc/header.html
index f0be10f..6ae7bb2 100644
--- a/inc/header.html
+++ b/inc/header.html
@@ -3,7 +3,8 @@
 <head>
   <title>Funkfeuer Graz</title>
   <meta charset="utf-8">
-  <link rel="stylesheet" type="text/css" href="/css/ffgraz.css" />
+  <link rel="stylesheet" title="Funkfeuer Graz" type="text/css" href="/css/ffgraz.css" />
+  <link rel="alternate stylesheet" title="Funkfeuer CI" type="text/css" href="/css/ffci.css" />
 </head>
 <body>
  <div id="header"></div>
diff --git a/template/index.html b/template/index.html
index 5d9bf08..bb7e4a2 100644
--- a/template/index.html
+++ b/template/index.html
@@ -3,7 +3,8 @@
 <head>
   <title>Funkfeuer Graz</title>
   <meta charset="utf-8">
-  <link rel="stylesheet" type="text/css" href="../css/ffgraz.css" />
+  <link rel="stylesheet" title="Funkfeuer CI" type="text/css" href="../css/ffci.css" />
+  <link rel="alternate stylesheet" title="Funkfeuer Graz" type="text/css" href="../css/ffgraz.css" />
 </head>
 <body>
  <div id="header"></div>
@@ -46,6 +47,8 @@
       <li><a href="http://karte.ffgraz.net">Karte</a></li>
       <li><a href="http://stats.ffgraz.net/topo/topology.png">Topologie</a></li>
       <li><a href="http://stats.ffgraz.net/smokeping/?target=Funkfeuer">SmokePing</a></li>
+
+
       <li><a href="http://stats.ffgraz.net/version/ff_version.png">Firmware Versionen</a></li>
    </ul>
 
@@ -60,7 +63,7 @@
       <h1>Funkfeuer Graz</h1>
 	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Curabitur sodales ligula in libero. </p>
 
-	<p>Sed dignissim lacinia nunc. Curabitur tortor. Pellentesque nibh. Aenean quam. In scelerisque sem at dolor. Maecenas mattis. Sed convallis tristique sem. Proin ut ligula vel nunc egestas porttitor. Morbi lectus risus, iaculis vel, suscipit quis, luctus non, massa. Fusce ac turpis quis ligula lacinia aliquet. Mauris ipsum. </p>
+	<p><a href="/">Sed dignissim</a> lacinia nunc. Curabitur tortor. Pellentesque nibh. Aenean quam. In scelerisque sem at dolor. Maecenas mattis. Sed convallis tristique sem. Proin ut ligula vel nunc egestas porttitor. Morbi lectus risus, iaculis vel, suscipit quis, luctus non, massa. Fusce ac turpis quis ligula lacinia aliquet. Mauris ipsum. </p>
 
 	<p>Nulla metus metus, ullamcorper vel, tincidunt sed, euismod in, nibh. Quisque volutpat condimentum velit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam nec ante. Sed lacinia, urna non tincidunt mattis, tortor neque adipiscing diam, a cursus ipsum ante quis turpis. Nulla facilisi. Ut fringilla. Suspendisse potenti. Nunc feugiat mi a tellus consequat imperdiet. Vestibulum sapien. Proin quam. Etiam ultrices. Suspendisse in justo eu magna luctus suscipit. Sed lectus. </p>