<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="description" content="eGonomy">
<title>eGonomy : Collectionner (non connecté)</title>
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css">
<script src="js/vendor/modernizr-2.6.2.min.js"></script>
</head>
<body>
<div class="popin-wrap">
<div id="collection-parameters" class="popin big-popin box-shadow">
<header>
<h2>PARAMÈTRES DE LA COLLECTION</h2>
<a href="#" class="close-popin"></a>
</header>
<section>
<form action="#">
<div class="col-left">
<table>
<tbody>
<tr>
<th>Vignette :</th>
<td>
<label class="no-margin styled-select">
<select class="w-192">
<option selected value="">Mosaïque</option>
<option value="/egonomy/allfragments/">Argumentaire</option>
</select>
</label>
</td>
</tr>
<tr>
<th>Visibilité :</th>
<td>
<label class="no-margin styled-select">
<select class="w-192">
<option selected value="">Visible par moi uniquement</option>
</select>
</label>
</td>
</tr>
<tr>
<th><label for="share-collection">Partager :</label></th>
<td>
<input id="share-collection" class="w-194" type="text" placeholder="http://">
</td>
</tr>
<tr>
<th colspan="2"><label for="description-collection">Description :</label></th>
</tr>
<tr>
<td colspan="2">
<textarea name="" id="description-collection"></textarea>
</td>
</tr>
</tbody>
</table>
</div>
<ul class="list-projets-2 clearfix float-left no-border-bot">
<li>
<div class="top clearfix">
<img src="img/113x113.png" alt="">
<img src="img/113x113-2.png" alt="">
</div>
<div class="mid">
<h3>Collection n°1</h3>
<p>par Hubert Trucchose</p>
</div>
<div class="bot clearfix">
<img src="img/113x113.png" alt="">
<img src="img/113x113-2.png" alt="">
</div>
</li>
</ul>
<div class="buttons">
<a href="#" class="btn close-popin">Annuler</a>
<input class="btn" type="submit" value="Valider">
</div>
</form>
</section>
</div>
</div>
<div class="wrap">
<header class="clearfix">
<h1><a href="#">egonomy</a></h1>
<div class="col-right">
<ul class="head-login clearfix">
<li>
<form method="GET" action="/egonomy/allpictures/">
<p class="clearfix">
<input id="id_search" type="text" placeholder="Rechercher dans le site">
<label class="styled-select">
<select>
<option selected="" value="/egonomy/allpictures/">Images</option>
<option value="/egonomy/allfragments/">Fragments</option>
</select>
</label>
</p>
<input type="hidden" name="field" value="all">
</form>
</li>
<li class="hello-user">Bonjour Anthony Ly</li>
<li><span class="dot-6"></span></li>
<li><a class="login" href="#">Déconnexion</a></li>
</ul>
<nav>
<ul class="nav clearfix">
<li><a href="#" title="home"><img src="img/icon-home.png" alt="home"></a></li>
<li><span class="dot-10"></span></li>
<li><a href="#">explorer</a></li>
<li><span class="dot-10"></span></li>
<li><a href="#">collectionner</a></li>
<li><span class="dot-10"></span></li>
<li><a href="#">créer</a></li>
<li><span class="dot-10"></span></li>
<li><a href="#">mon profil</a></li>
</ul>
</nav>
</div>
</header>
<section>
<div class="title-page">
<h2>Romantisme noir</span></h2>
<ul class="sub-nav title-menu clearfix">
<li><a href="#">argumentaire</a></li>
<li><span class="dot-6"></span></li>
<li><a href="#" class="active">mosaïque</a></li>
<li><span class="dot-6"></span></li>
<li><a href="#">géographique</a></li>
<li><span class="dot-6"></span></li>
<li><a href="#">envoyer vers collage</a></li>
</ul>
</div>
<div class="bar-tools clearfix">
<ul class="clearfix">
<li><a class="toggle-comment" href="#">
<span class="show-comment">Afficher</span>
<span class="hide-comment">Masquer</span> les commentaires
</a></li>
<li><a href="#">imprimer la vue en PDF</a></li>
<li><a class="icon save" href="#">enregistrer sous</a></li>
<li><a class="open-popin" href="#collection-parameters">paramètres de la collection</a></li>
</ul>
</div>
<div class="clearfix">
<div class="filters-wrap float-left">
<ul class="filters">
<li class="box-shadow-2"><a class="display-keyword" data-keyword="héroïne gréco-romaine" href="#">
Musée Grévin Musée GrévinMusée GrévinMusée GrévinMusée Grévin<a class="icon-action cross" href="#"></a>
</a></li>
<li class="box-shadow-2"><a class="display-keyword" data-keyword="Musée Grévin" href="#">
Musée Grévin Musée GrévinMusée GrévinMusée GrévinMusée Grévin<a class="icon-action cross" href="#"></a>
</a></li>
<li class="box-shadow-2"><a class="display-keyword" data-keyword="Beaux Arts" href="#">
Beaux Arts Lorem Lorem ipsum dolor sit amet, consectetur adipisicing elit. Placeat perferendis esse ab error tempora vel dolore beatae eveniet quaerat ut facilis tenetur minima corporis suscipit quidem alias accusantium ex recusandae. <a class="icon-action cross" href="#"></a>
</a></li>
<li class="box-shadow-2"><a class="display-keyword" data-keyword="éè" href="#">
éè <a class="icon-action cross" href="#"></a>
</a></li>
<li class="box-shadow-2"><a class="display-keyword" data-keyword="über ällës" href="#">
über ällës <a class="icon-action cross" href="#"></a>
</a></li>
</ul>
</div>
<ul class="list-projets-5 mosaic float-left clearfix masonry-177">
<li class="item-masonry" data-keywords="héroïne gréco-romaine, über ällës, Beaux Arts, éè">
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x224.png" alt="">
<div class="tools toggle">
<div class="title-project">
<h3>Sapho</h3>
<h4>Théodore Chasseriau</h4>
</div>
<ul class="clearfix">
<li><a title="Partager sur Twitter" class="tool twitter" href="#"></a></li>
<li><a title="Partager sur Facebook" class="tool facebook" href="#"></a></li>
<li><a title="Ajouter à ma collection" class="tool plus" href="#"></a></li>
<li><a title="Créer un fragment" class="tool cut" href="#"></a></li>
<li><a title="Supprimer" class="tool trash" href="#"></a></li>
</ul>
</div>
</div>
<div class="content-project">
<div class="title-project">
<h3>Sapho</h3>
<h4>Théodore Chasseriau</h4>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minus aut nostrum omnis cumque maxime delectus numquam natus sapiente enim reiciendis nulla animi praesentium odio cupiditate temporibus! Nisi alias eius animi.</p>
</div>
</li>
<li class="item-masonry" data-keywords="Beaux Arts">
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x264.png" alt="">
<div class="tools toggle">
<div class="title-project">
<h3>Dolores ipsum des dolores</h3>
<h4>Théodore Chasseriau</h4>
</div>
<ul class="clearfix">
<li><a title="Partager sur Twitter" class="tool twitter" href="#"></a></li>
<li><a title="Partager sur Facebook" class="tool facebook" href="#"></a></li>
<li><a title="Ajouter à ma collection" class="tool plus" href="#"></a></li>
<li><a title="Créer un fragment" class="tool cut" href="#"></a></li>
<li><a title="Supprimer" class="tool trash" href="#"></a></li>
</ul>
</div>
</div>
<div class="content-project">
<div class="title-project">
<h3>Dolores ipsum des dolores</h3>
<h4>Théodore Chasseriau</h4>
</div>
<p>Lorem ipsum dolor</p>
</div>
</li>
<li class="item-masonry" data-keywords="éè">
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x232.png" alt="">
<div class="tools toggle">
<div class="title-project">
<h3>azerty qwerty allo hello</h3>
<h4>Théodore Chasseriau</h4>
</div>
<ul class="clearfix">
<li><a title="Partager sur Twitter" class="tool twitter" href="#"></a></li>
<li><a title="Partager sur Facebook" class="tool facebook" href="#"></a></li>
<li><a title="Ajouter à ma collection" class="tool plus" href="#"></a></li>
<li><a title="Créer un fragment" class="tool cut" href="#"></a></li>
<li><a title="Supprimer" class="tool trash" href="#"></a></li>
</ul>
</div>
</div>
<div class="content-project">
<div class="title-project">
<h3>azerty qwerty allo hello</h3>
<h4>Théodore Chasseriau</h4>
</div>
<p>azerty qwerty allo hello azerty qwerty allo hello</p>
</div>
</li>
<li class="item-masonry" data-keywords="über ällës">
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x224.png" alt="">
<div class="tools toggle">
<div class="title-project">
<h3>Sapho</h3>
<h4>Théodore Chasseriau</h4>
</div>
<ul class="clearfix">
<li><a title="Partager sur Twitter" class="tool twitter" href="#"></a></li>
<li><a title="Partager sur Facebook" class="tool facebook" href="#"></a></li>
<li><a title="Ajouter à ma collection" class="tool plus" href="#"></a></li>
<li><a title="Créer un fragment" class="tool cut" href="#"></a></li>
<li><a title="Supprimer" class="tool trash" href="#"></a></li>
</ul>
</div>
</div>
<div class="content-project">
<div class="title-project">
<h3>Sapho</h3>
<h4>Théodore Chasseriau</h4>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minus aut nostrum omnis cumque maxime delectus numquam natus sapiente enim reiciendis nulla animi praesentium odio cupiditate temporibus! Nisi alias eius animi.</p>
</div>
</li>
<li class="item-masonry" data-keywords="Musée Grévin, über ällës">
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x224.png" alt="">
<div class="tools toggle">
<div class="title-project">
<h3>Sapho</h3>
<h4>Théodore Chasseriau</h4>
</div>
<ul class="clearfix">
<li><a title="Partager sur Twitter" class="tool twitter" href="#"></a></li>
<li><a title="Partager sur Facebook" class="tool facebook" href="#"></a></li>
<li><a title="Ajouter à ma collection" class="tool plus" href="#"></a></li>
<li><a title="Créer un fragment" class="tool cut" href="#"></a></li>
<li><a title="Supprimer" class="tool trash" href="#"></a></li>
</ul>
</div>
</div>
<div class="content-project">
<div class="title-project">
<h3>Sapho</h3>
<h4>Théodore Chasseriau</h4>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minus aut nostrum omnis cumque maxime delectus numquam natus sapiente enim reiciendis nulla animi praesentium odio cupiditate temporibus! Nisi alias eius animi.</p>
</div>
</li>
<li class="item-masonry" data-keywords="Beaux Arts">
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x264.png" alt="">
<div class="tools toggle">
<div class="title-project">
<h3>Dolores ipsum des dolores</h3>
<h4>Théodore Chasseriau</h4>
</div>
<ul class="clearfix">
<li><a title="Partager sur Twitter" class="tool twitter" href="#"></a></li>
<li><a title="Partager sur Facebook" class="tool facebook" href="#"></a></li>
<li><a title="Ajouter à ma collection" class="tool plus" href="#"></a></li>
<li><a title="Créer un fragment" class="tool cut" href="#"></a></li>
<li><a title="Supprimer" class="tool trash" href="#"></a></li>
</ul>
</div>
</div>
<div class="content-project">
<div class="title-project">
<h3>Dolores ipsum des dolores</h3>
<h4>Théodore Chasseriau</h4>
</div>
<p>Lorem ipsum dolor</p>
</div>
</li>
<li class="item-masonry" data-keywords="éè">
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x232.png" alt="">
<div class="tools toggle">
<div class="title-project">
<h3>azerty qwerty allo hello</h3>
<h4>Théodore Chasseriau</h4>
</div>
<ul class="clearfix">
<li><a title="Partager sur Twitter" class="tool twitter" href="#"></a></li>
<li><a title="Partager sur Facebook" class="tool facebook" href="#"></a></li>
<li><a title="Ajouter à ma collection" class="tool plus" href="#"></a></li>
<li><a title="Créer un fragment" class="tool cut" href="#"></a></li>
<li><a title="Supprimer" class="tool trash" href="#"></a></li>
</ul>
</div>
</div>
<div class="content-project">
<div class="title-project">
<h3>azerty qwerty allo hello</h3>
<h4>Théodore Chasseriau</h4>
</div>
<p>azerty qwerty allo hello azerty qwerty allo hello</p>
</div>
</li>
<li class="item-masonry" data-keywords="über ällës">
<div class="curtain"></div>
<div class="visuel-project">
<img src="img/177x224.png" alt="">
<div class="tools toggle">
<div class="title-project">
<h3>Sapho</h3>
<h4>Théodore Chasseriau</h4>
</div>
<ul class="clearfix">
<li><a title="Partager sur Twitter" class="tool twitter" href="#"></a></li>
<li><a title="Partager sur Facebook" class="tool facebook" href="#"></a></li>
<li><a title="Ajouter à ma collection" class="tool plus" href="#"></a></li>
<li><a title="Créer un fragment" class="tool cut" href="#"></a></li>
<li><a title="Supprimer" class="tool trash" href="#"></a></li>
</ul>
</div>
</div>
<div class="content-project">
<div class="title-project">
<h3>Sapho</h3>
<h4>Théodore Chasseriau</h4>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minus aut nostrum omnis cumque maxime delectus numquam natus sapiente enim reiciendis nulla animi praesentium odio cupiditate temporibus! Nisi alias eius animi.</p>
</div>
</li>
</ul>
</div>
</section>
<footer class="clearfix">
<h6>EGONOMY est un projet de l’IRI et de la réunion des Musées Nationaux</h6>
<p>Mai 2013</p>
</footer>
</div><!-- /.wrap -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.9.1.min.js"><\/script>')</script>
<script src="js/masonry.min.js"></script>
<script src="js/main.js"></script>
</body>
</html>