{% extends "base.html" %}

{% block content %}

     <div id="topsection">
    	<div class="main">
        	<div class="topnews">
            	<div class="news-text">With your help we raise money to buy book rights. The unglued books are free to download, here.</div>
                <div class="news-links"><a class="readon"><span>Learn more</span></a></div>
            </div>
            <div class="search">
            <div class="search-inner">
            	<form action="">
                	<input type="text" onfocus="if (this.value=='Search for a book...') this.value='';" onblur="if (this.value=='') this.value='Search for a book...';" value="Search for a book..." size="30" class="inputbox" maxlength="200" id="ssearchword" name="searchword">
                    <input type="button" onclick="this.form.searchword.focus();"  class="button" value="Search">
                </form>
            </div>
            </div>
        </div>
    </div>
    
    <div id="main-container">
    <div class="main">
    	<div id="leftcol">
        	<div class="jsmodule">
            	<h3 class="jsmod-title"><span>Explore</span></h3>
                <div class="jsmod-content">
                	<ul class="menu level1">
                    	<li class="first parent">
                        	<a href="#"><span>Show me...</span></a>
                        	<ul class="menu level2">
                            	<li class="first"><a href="#"><span>Recommended</span></a></li>
								<li><a href="#"><span>Popular</span></a></li>
								<li><a href="#"><span>Almost unglued</span></a></li>
								<li><a href="#"><span>Recently unglued</span></a></li>
								<li><a href="#"><span>Ending Soon</span></a></li>
								<li class="last"><a href="#"><span>Just Listed</span></a></li>
                            </ul>
                        </li>
                        <li class="parent">
                        	<a href="#"><span>Show me...</span></a>
                        	<ul class="menu level2">
                            	<li class="first"><a href="#"><span>Recommended</span></a></li>
								<li><a href="#"><span>Popular</span></a></li>
								<li><a href="#"><span>Almost unglued</span></a></li>
								<li><a href="#"><span>Recently unglued</span></a></li>
								<li><a href="#"><span>Ending Soon</span></a></li>
								<li class="last"><a href="#"><span>Just Listed</span></a></li>
                            </ul>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div id="maincol-fr">
        <div class="maincol-inner">
        	<div class="content-block">
            	<div class="content-block-heading">
                    <h2 class="content-heading">Currently being <span>unglued</span></h2>
                    <a class="block-link">See all books</a>
                </div>
                <div class="content-block-content">
                	<div class="row row1 cols3">
                    	<div class="column column-left">
                        	<div class="item item1">
                            	<div class="book-image">
                            	<img src="/static/images/images/book1.png" align="" title="" />
                                </div>
                                <div class="book-info">
                                	<div class="book-name">
                                    	Nineteen Eighty-Four
                                    </div>
                                	<div class="book-author">
                                    	George Orwell
										Penguin
                                    </div>
                                </div>
                                <div class="book-status">
                                	<span class="unglue">unglue</span> status 99%
                                    <span class="status percent99">&nbsp;</span>
                                </div>
                            </div>
                            <div class="item item2">
                            	<div class="book-image">
                            	<img src="/static/images/images/book4.png" align="" title="" />
                                </div>
                                <div class="book-info">
                                	<div class="book-name">
                                    	Nineteen Eighty-Four
                                    </div>
                                	<div class="book-author">
                                    	George Orwell
										Penguin
                                    </div>
                                    <span class="book-new">
                                    </span>
                                </div>
                                <div class="book-status">
                                	<span class="unglue">unglue</span> status 7%
                                    <span class="status percent7">&nbsp;</span>
                                </div>
                            </div>
                        </div>
                        <div class="column column-center">
                        	<div class="item item1">
                            	<div class="book-image">
                            	<img src="/static/images/images/book2.png" align="" title="" />
                                </div>
                                <div class="book-info">
                                	<div class="book-name">
                                    	Nineteen Eighty-Four
                                    </div>
                                	<div class="book-author">
                                    	George Orwell
										Penguin
                                    </div>
                                </div>
                                <div class="book-status">
                                	<span class="unglue">unglue</span> status 60%
                                    <span class="status percent60">&nbsp;</span>
                                </div>
                            </div>
                            <div class="item item2">
                            	<div class="book-image">
                            	<img src="/static/images/images/book5.png" align="" title="" />
                                </div>
                                <div class="book-info">
                                	<div class="book-name">
                                    	Nineteen Eighty-Four
                                    </div>
                                	<div class="book-author">
                                    	George Orwell
										Penguin
                                    </div>
                                </div>
                                <div class="book-status">
                                	<span class="unglue">unglue</span> status 62%
                                    <span class="status percent62">&nbsp;</span>
                                </div>
                            </div>
                        </div>
                        <div class="column column-right">
                        	<div class="item item1">
                            	<div class="book-image">
                            	<img src="/static/images/images/book3.png" align="" title="" />
                                </div>
                                <div class="book-info">
                                	<div class="book-name">
                                    	Nineteen Eighty-Four
                                    </div>
                                	<div class="book-author">
                                    	George Orwell
										Penguin
                                    </div>
                                </div>
                                <div class="book-status">
                                	<span class="unglue">unglue</span> status 22%
                                    <span class="status percent22">&nbsp;</span>
                                </div>
                            </div>
                            <div class="item item2">
                            	<div class="book-image">
                            	<img src="/static/images/images/book6.png" align="" title="" />
                                </div>
                                <div class="book-info">
                                	<div class="book-name">
                                    	Nineteen Eighty-Four
                                    </div>
                                	<div class="book-author">
                                    	George Orwell
										Penguin
                                    </div>
                                </div>
                                <div class="book-status">
                                	<span class="unglue">unglue</span> status 21%
                                    <span class="status percent21">&nbsp;</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                </div>
            </div>
            <div class="content-block">
            	<div class="content-block-heading">
                    <h2 class="content-heading">Most popular</h2>
                    <a class="block-link">See all books</a>
                </div>
                <div class="content-block-content">
                	<div class="row row1 cols3">
                    	<div class="column column-left">
                        	<div class="item item1">
                            	<div class="book-image">
                            	<img src="/static/images/images/book1.png" align="" title="" />
                                </div>
                                <div class="book-info">
                                	<div class="book-name">
                                    	Nineteen Eighty-Four
                                    </div>
                                	<div class="book-author">
                                    	George Orwell
										Penguin
                                    </div>
                                </div>
                                <div class="book-status">
                                	<span class="unglue">unglue</span> status 99%
                                    <span class="status percent99">&nbsp;</span>
                                </div>
                            </div>
                            <div class="item item2">
                            	<div class="book-image">
                            	<img src="/static/images/images/book4.png" align="" title="" />
                                </div>
                                <div class="book-info">
                                	<div class="book-name">
                                    	Nineteen Eighty-Four
                                    </div>
                                	<div class="book-author">
                                    	George Orwell
										Penguin
                                    </div>
                                    <span class="book-new">
                                    </span>
                                </div>
                                <div class="book-status">
                                	<span class="unglue">unglue</span> status 7%
                                    <span class="status percent7">&nbsp;</span>
                                </div>
                            </div>
                        </div>
                        <div class="column column-center">
                        	<div class="item item1">
                            	<div class="book-image">
                            	<img src="/static/images/images/book2.png" align="" title="" />
                                </div>
                                <div class="book-info">
                                	<div class="book-name">
                                    	Nineteen Eighty-Four
                                    </div>
                                	<div class="book-author">
                                    	George Orwell
										Penguin
                                    </div>
                                </div>
                                <div class="book-status">
                                	<span class="unglue">unglue</span> status 60%
                                    <span class="status percent60">&nbsp;</span>
                                </div>
                            </div>
                            <div class="item item2">
                            	<div class="book-image">
                            	<img src="/static/images/images/book5.png" align="" title="" />
                                </div>
                                <div class="book-info">
                                	<div class="book-name">
                                    	Nineteen Eighty-Four
                                    </div>
                                	<div class="book-author">
                                    	George Orwell
										Penguin
                                    </div>
                                </div>
                                <div class="book-status">
                                	<span class="unglue">unglue</span> status 62%
                                    <span class="status percent62">&nbsp;</span>
                                </div>
                            </div>
                        </div>
                        <div class="column column-right">
                        	<div class="item item1">
                            	<div class="book-image">
                            	<img src="/static/images/images/book3.png" align="" title="" />
                                </div>
                                <div class="book-info">
                                	<div class="book-name">
                                    	Nineteen Eighty-Four
                                    </div>
                                	<div class="book-author">
                                    	George Orwell
										Penguin
                                    </div>
                                </div>
                                <div class="book-status">
                                	<span class="unglue">unglue</span> status 22%
                                    <span class="status percent22">&nbsp;</span>
                                </div>
                            </div>
                            <div class="item item2">
                            	<div class="book-image">
                            	<img src="/static/images/images/book6.png" align="" title="" />
                                </div>
                                <div class="book-info">
                                	<div class="book-name">
                                    	Nineteen Eighty-Four
                                    </div>
                                	<div class="book-author">
                                    	George Orwell
										Penguin
                                    </div>
                                </div>
                                <div class="book-status">
                                	<span class="unglue">unglue</span> status 21%
                                    <span class="status percent21">&nbsp;</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                </div>
            </div>
        </div>
        </div>
    </div>
    </div>

{% endblock %}