diff --git a/base.php b/base.php
index 56503c6..68aaa9a 100644
--- a/base.php
+++ b/base.php
@@ -165,16 +165,7 @@ class Entry
     public $localUpdated;
     private static $updated = NULL;
     
-    public static $icons = array(
-        Author::ALL_AUTHORS_ID       => 'images/author.png',
-        Serie::ALL_SERIES_ID         => 'images/serie.png',
-        Book::ALL_RECENT_BOOKS_ID    => 'images/recent.png',
-        Tag::ALL_TAGS_ID             => 'images/tag.png',
-        CustomColumn::ALL_CUSTOMS_ID => 'images/tag.png',
-        "calibre:books$"             => 'images/allbook.png',
-        "calibre:books:letter"       => 'images/allbook.png'
-    );
-    
+   
     public function getUpdatedTime () {
         if (!is_null ($this->localUpdated)) {
             return date (DATE_ATOM, $this->localUpdated);
@@ -193,16 +184,6 @@ class Entry
         $this->contentType = $pcontentType;
         $this->linkArray = $plinkArray;
         
-        if ($config['cops_show_icons'] == 1)
-        {
-            foreach (self::$icons as $reg => $image)
-            {
-                if (preg_match ("/" . $reg . "/", $pid)) {
-                    array_push ($this->linkArray, new Link (getUrlWithVersion ($image), "image/png", Link::OPDS_THUMBNAIL_TYPE));
-                    break;
-                }
-            }
-        }
     }
 }
 
diff --git a/index.php b/index.php
index f6e2384..98aec5f 100644
--- a/index.php
+++ b/index.php
@@ -45,10 +45,9 @@
 
 
 ?>
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
+<!DOCTYPE html>
+<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
-    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
     <meta http-equiv="imagetoolbar" content="no" />
     <meta name="viewport" content="width=device-width, height=device-height, user-scalable=no" />
     <title><?php echo htmlspecialchars ($currentPage->title) ?></title>
@@ -59,6 +58,7 @@
     <link rel="icon" type="image/vnd.microsoft.icon" href="<?php echo $currentPage->favicon ?>" />
     <link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox.css?v=2.1.3" media="screen" />
     <link rel="stylesheet" type="text/css" href="<?php echo getUrlWithVersion("style.css") ?>" media="screen" />
+	<link rel="stylesheet" href="//normalize-css.googlecode.com/svn/trunk/normalize.css" />
     <script type="text/javascript">
         $(document).ready(function() {
             // Handler for .ready() called.
@@ -147,21 +147,14 @@
   <p><img src="images/ajax-loader.gif" alt="waiting" /> Please Wait</p>
 </div>
 <div class="container">
-    <div class="head">
-        <div class="headleft">
-            <a href="<?php echo $_SERVER["SCRIPT_NAME"] ?>">
+    <header>
+        <a class="headleft" href="<?php echo $_SERVER["SCRIPT_NAME"] ?>">
                 <img src="<?php echo getUrlWithVersion("images/home.png") ?>" alt="Home" />
-            </a>
-        </div>
-        <div class="headright">
-            <img id="searchImage" src="<?php echo getUrlWithVersion("images/setting64.png") ?>" alt="Settings and menu" />
-        </div>
-        <div class="headcenter">
-            <p><?php echo htmlspecialchars ($currentPage->title) ?></p>
-        </div>
-    </div>
-    <div class="clearer" />
-    <div class="menu">
+        </a>
+        <img class="headright" id="searchImage" src="<?php echo getUrlWithVersion("images/setting64.png") ?>" alt="Settings and menu" />
+        <h1><?php echo htmlspecialchars ($currentPage->title) ?></h1>
+    </header>
+    <aside>
         <div id="search" class="search">
             <form action="index.php?page=9" method="get">
                 <input type="text" name="query" />
@@ -182,10 +175,10 @@
                 <img id="sort" src="images/sort32.png" alt="Sort" />
             </form>
         </div>
-    </div>
-    <div class="clearer" />
-    <div id="content" style="display: none;"></div>
-    <div class="entries">
+    </aside>
+	
+	<div id="content" style="display: none;"></div>
+    <section>
         <?php
             if ($page == Base::PAGE_BOOK_DETAIL)
             {
@@ -194,33 +187,29 @@
             foreach ($currentPage->entryArray as $entry) {
                 if (get_class ($entry) != "EntryBook") {
         ?>
-        <div class="entry">
-            <div class="entryTitle"><?php echo htmlspecialchars ($entry->title) ?></div>
-            <div class="entryContent"><?php echo htmlspecialchars ($entry->content) ?></div>
-        <?php
-            foreach ($entry->linkArray as $link) {
-        ?>
-            <a href="<?php echo $link->hrefXhtml () ?>" class="navigation">nav</a>
-        <?php
-            }
-        ?>
-        </div>
+        <article>
+			<div class="frontpage">
+			<?php foreach ($entry->linkArray as $link) {?> <a href="<?php echo $link->hrefXhtml () ?>">
+					<h2><?php echo htmlspecialchars ($entry->title) ?></h2>
+					<?php } ?>
+					<h4><?php echo htmlspecialchars ($entry->content) ?></h4> 
+				</a>
+			</div>
+		</article>
         <?php
                 }
                 else
                 {
         ?>
-        <div class="book">
-            <div class="cover">
+        <article>
+			<div class="books">
             <?php
                 if ($entry->book->hasCover) {
             ?>
-                <a rel="group" class="fancycover" href="<?php echo $entry->getCover () ?>"><img src="<?php echo $entry->getCoverThumbnail () ?>" alt="<?php echo localize("i18n.coversection") ?>" /></a>
+                <span class="cover"><a rel="group" class="fancycover" href="<?php echo $entry->getCover () ?>"><img src="<?php echo $entry->getCoverThumbnail () ?>" alt="<?php echo localize("i18n.coversection") ?>" /></a></span>
             <?php
                 }
             ?>
-            </div>
-            <div class="download">
             <?php
                 $i = 0;
                 foreach ($config['cops_prefered_format'] as $format)
@@ -229,49 +218,44 @@
                     if ($data = $entry->book->getDataFormat ($format)) {
                         $i++;
             ?>    
-                <div class="button buttonEffect"><a href="<?php echo $data->getHtmlLink () ?>"><?php echo $format ?></a></div>
-            <?php
+                <h2 class="download"><a href="<?php echo $data->getHtmlLink () ?>"><?php echo $format ?></a></h2>
+				<?php
                     }
                 }
             ?>
-            </div>
-            <div class="bookdetail">
-                <a class="navigation" href="<?php echo $entry->book->getDetailUrl () ?>" />
-                <div class="entryTitle st"><?php echo htmlspecialchars ($entry->title) ?>
+            
+            <a class="navigation" href="<?php echo $entry->book->getDetailUrl () ?>" />
+                <h2><?php echo htmlspecialchars ($entry->title) ?>
             <?php
                 if ($entry->book->getPubDate() != "")
                 {
             ?>
-                    <span class="sp">(<?php echo $entry->book->getPubDate() ?>)</span>
+                    (<?php echo $entry->book->getPubDate() ?>)
             <?php
                 }
             ?>
-                    <span class="sr"><?php echo $entry->book->getRating () ?></span>
-                </div>
-                <div class="entryContent sa"><?php echo localize("authors.title") . " : " . htmlspecialchars ($entry->book->getAuthorsName ()) ?></div>
-                <div class="entryContent"><?php echo localize("tags.title") . " : " . htmlspecialchars ($entry->book->getTagsName ()) ?></div>
+                    <?php echo $entry->book->getRating () ?></h2>
+                <h4><?php echo localize("authors.title") . " : </h4>" . htmlspecialchars ($entry->book->getAuthorsName ()) ?><br />
+                <h4><?php echo localize("tags.title") . " : </h4>" . htmlspecialchars ($entry->book->getTagsName ()) ?><br />
             <?php
                 $serie = $entry->book->getSerie ();
                 if (!is_null ($serie)) {
             ?>
-                <div class="entryContent ss"><?php echo localize("series.title") . " : " . htmlspecialchars ($serie->name) . " (" . $entry->book->seriesIndex . ")" ?></div>
+                <h4><?php echo localize("series.title") . " :</h4> " . htmlspecialchars ($serie->name) . " (" . $entry->book->seriesIndex . ")" ?><br />
             <?php
                 }
             ?>
-            </div>
-        </div>
+			</div>
+        </article>
         <?php
                 }
         ?>
-        <div class="clearer" />
         <?php
             }
         ?>
-    </div>
-    <div class="foot">
-        <div class="footright">
-            <a class="fancyabout" href="about.xml"><img src="<?php echo getUrlWithVersion("images/info.png") ?>" alt="Home" /></a>
-        </div>
+    </section>
+    <footer>
+            <a href="about.xml"><img src="<?php echo getUrlWithVersion("images/info.png") ?>" alt="Home" /></a>
 <?php
     if ($currentPage->isPaginated ()) {
 ?> 
@@ -296,7 +280,7 @@
 <?php
     }
 ?>
-    </div>
+    </footer>
 </div>
 </body>
 </html>
diff --git a/style.css b/style.css
index e292f78..afbcfec 100644
--- a/style.css
+++ b/style.css
@@ -1,225 +1,159 @@
-html
-{
-font-family: sans-serif;
-font-size: 1em;
-padding:0px;
-margin:0px;
-background-color:lightgray;
+/* Global Box Sizing and Font-Smoothing */	 
+*, *:after, *:before {
+	box-sizing:border-box;
+	-webkit-box-sizing:border-box;
+	-moz-box-sizing:border-box;
+	-webkit-font-smoothing:antialiased;
+	-moz-font-smoothing:antialiased;
+	-o-font-smoothing:antialiased;
+	font-smoothing:antialiased;
+	text-rendering:optimizeLegibility;
 }
 
-body
-{
-margin-top:0px;
+html { font-size: 100%; -webkit-text-size-adjust: 100%; 
+                          -ms-text-size-adjust: 100%; }
+
+body {
+	font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; /* Serve Helvetica Neue, with Helvetica fallbacks to Arial */
+	font-size: 0.75em;/*12px/16px */
+	font-weight:300; /* Better supported than 'lighter' attribute */
+	line-height:18px;
+	color: #1c1c1c; /* Lighter on the eyes than #000 Black */
+	margin: 0px; background: #cccccc; background-size: cover;
 }
 
-.container
-{
-margin:auto;
-width:100%;
-max-width:800px;
+img {
+	border: 0px;
+	max-width: 100%;
+	height: auto;
+	width: auto\9; /* ie8 */
 }
 
-.head
-{
-color:white;
-background-color:black;
-width:100%;
-height:64px;
+/* ==========================================================================
+   Typography stuff goes here
+   ========================================================================== */
+h1,h2,h3,h4,h5,h6 { font-weight: bold; margin:0; padding:0;}
+/*h1 see mediaqueries*/ 
+h2 {font-size: 1.2em;}
+h3 {font-size: 1.1em;}
+h4 {font-size: 1.0em; }
+h5 {font-size: 0.83em;}
+h6 {font-size: 0.75em;}
+
+a:hover, a:active { outline: none; }
+a { color: #2f4f4f ; text-decoration: none;}
+a:visited { color:#414141 ;  }
+a:hover { color: black; text-decoration: underline; }
+.frontpage a:hover { display:inline-block; width: 100%; background-color: #778899;}
+
+/* =============================================================================
+   Main container stuff goes here
+   ========================================================================== */
+.container{
+ background: #414141; border:1px solid #000; border-radius:10px;
+	max-width:800px;width:95%;margin:0 auto;position:relative; }
+
+/* =============================================================================
+   Header stuff goes here
+   ========================================================================== */
+header {
+	clear:both; 
+	color:white; 
+	text-align:center; 
+	text-transform:uppercase; 
+	display:block;
+	box-shadow:inset 0px -5px 8px #000000;
+	min-height:70px;
+	border-radius: 10px 10px 0px 0px; 
 }
 
-.foot
-{
-color:white;
-background-color:black;
-width:100%;
-height:32px;
+.headleft {
+	float: left;
 }
 
-img
-{
-margin:0;
-padding:0;
-border:0;
+header h1{
+	float:none;
+	padding-top:25px;
 }
 
-.headleft
-{
-float:left;
-height:64px;
+.headright {
+	float: right;
 }
 
-.headright
-{
-float:right;
-height:64px;
-cursor:pointer;
+/* =============================================================================
+   Section and Article stuff goes here
+   ========================================================================== */
+section {
+clear:both;
+background-color: #fff;
 }
 
-.footright
-{
-float:right;
-height:32px;
+article {
+border-bottom: 1px solid black;
 }
 
+/*-------------frontpage article-------------*/
 
-.headcenter
-{
-margin:auto;
-text-align:center;
-font-size: 1.5em;
-font-weight:bold;
-height:64px;
-display:table;
+.frontpage h2 {
+	padding: 5px 0 0 5px;
 }
 
-.footcenter
-{
-margin:auto;
-text-align:center;
-font-size: 1.3em;
-font-weight:bold;
-height:32px;
-display:table;
+.frontpage h4 {
+	padding: 5px 0 5px 20px;
+	 font-style: italic;
 }
 
-
-.headcenter p, .footcenter p, .footcenter a
-{
-display: table-cell;
-vertical-align: middle;
-text-align: center;
-line-height: 100%;
+/*-------------books article-------------*/
+.books {
+	clear: both;
+	padding: 10px;
 }
 
-.clearer 
+.cover {
+	float:left;
+	padding: 0 10px 0 0;
+	min-width: 56px;
+	min-height: 70px;
+}
+
+.download {
+	float: right;
+}
+
+.download a {
+	border-radius: 6px;
+	box-shadow:0 0 10px #000;
+	background: darkgray;  
+	background: radial-gradient(#666, black);
+	color: #EEE;
+	text-decoration : none;
+	font-weight: bold;
+	padding: 5px;
+}
+
+.books h4{
+ 	display: inline;
+	font-style: italic;
+}
+
+/* =============================================================================
+   Footer stuff goes here
+   ========================================================================== */
+footer
 {
 clear:both;
+box-shadow:inset 0px 5px 8px #000000;
+border-radius: 0px 0px 10px 10px; 
+height:32px;
 }
 
-.entries
-{
-background-color:lightgray;
-margin-top: 5px;
+footer a{
+	float: right;
 }
-
-.entry
-{
-background-color:white;
-border-bottom:1px double black;
-display:block;
-padding:2px;
-cursor: pointer;
-margin-bottom:5px;
-}
-
-.book
-{
-background-color:white;
-border-bottom:1px double black;
-min-height:80px;
-margin-bottom:5px;
-}
-
-.navigation
-{
-display:none;
-}
-
-.entryTitle
-{
-font-weight:bold;
-font-size: 1.1em;
-}
-
-.entryContent
-{
-font-style:italic;
-font-size: 0.9em;
-margin-left: 10px;
-}
-
-.cover
-{
-float:left;
-padding:5px 10px;
-min-width: 56px;
-min-height: 70px;
-}
-
-.download
-{
-float:right;
-}
-
-.button
-{
-height:36px;
-display: table;
-width:80px;
-margin:2px;
-}
-
-
-.button p, .button a
-{
-display: table-cell;
-vertical-align: middle;
-text-align: center;
-}
-
-#loading 
-{
-display:none;
-position:fixed;
-left:0;
-top:0;
-width:100%;
-height:100%;
-background-color: #ccc;
-filter: alpha(opacity=70);
-opacity: 0.70;
-text-align: center;
-padding-top: 120px;
-}
-
-.entrySection
-{
-margin-top: 8px;
-margin-bottom: 18px;
-line-height: 1.5em;
-}
-
-.entrySection span
-{
-font-style:italic;
-font-size: 1em;
-}
-
-
-.buttonEffect a
-{
-border-radius: 6px;
-background: darkgray;  
-background: -moz-radial-gradient(#666, black);
-background: -webkit-radial-gradient(#666, black);
-background: -ms-radial-gradient(#666, black);
-background: radial-gradient(#666, black);
-color: #EEE;
-text-decoration : none;
-font-weight: bold;
-}
-
-.pad6 a
-{
-padding: 6px;
-}
-
-.pad6
-{
-display: inline;
-}
-
-.menu
+/* =============================================================================
+   Aside stuff goes here
+   ========================================================================== */
+aside
 {
 float: right;
 width : 250px;
@@ -233,6 +167,7 @@ position: absolute;
 background: white;
 }
 
+/*-------------Search Aside-------------*/
 .search form
 {
 background-color: black;
@@ -253,26 +188,43 @@ float:right;
 padding: 3px 2px;
 }
 
-.bookdetail
+#loading 
 {
-color:black;
+display:none;
+position:fixed;
+left:0;
+top:0;
+width:100%;
+height:100%;
+background-color: #ccc;
+filter: alpha(opacity=70);
+opacity: 0.70;
+text-align: center;
+padding-top: 120px;
 }
 
-
-.bookpopup
-{
-min-width: 400px;
-color:black;
+/* =============================================================================
+   Mediaquerie stuff goes here
+   ========================================================================== */
+/* 100px and greater */
+@media only screen and (min-width: 100px) {
+h1 {font-size: 1em;}
+.container { width:100%; }
+}
+   
+/* 320px and greater */
+@media only screen and (min-width: 320px) {
+h1 {font-size: 1.2em;}
 }
 
-.entries > .bookpopup, .entries > .bookdetail
-{
-background-color: white;
-margin-bottom: 5px;
-padding: 6px;
+/* 480px and greater */
+@media only screen and (min-width: 480px) {
+h1 {font-size: 1.5em;}
 }
 
-.content
-{
-line-height: 110%;
-}
+/* 810px and greater */
+@media only screen and (min-width: 768px) {
+h1 {font-size: 2em;}
+.container { box-shadow:0 0 20px #000; }
+body { margin: 5px; }
+}
\ No newline at end of file
