crea/inte-crea/home.html
changeset 211 7d0146012cd5
parent 210 76a76267a1c1
child 212 37dd17a1e48b
equal deleted inserted replaced
210:76a76267a1c1 211:7d0146012cd5
     2 <html>
     2 <html>
     3 <head>
     3 <head>
     4     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     4     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     5     <title>Plateforme LDT : Home</title>
     5     <title>Plateforme LDT : Home</title>
     6     <link rel="stylesheet" href="css/ldt-commun.css" type="text-css" />
     6     <link rel="stylesheet" href="css/ldt-commun.css" type="text-css" />
       
     7     <link rel="stylesheet" href="css/ldt-home.css" type="text-css" />
     7 </head>
     8 </head>
     8 <body>
     9 <body>
     9 
    10 
    10     <div id="general_container">
    11     <div id="general_container">
    11 
    12 
    37 
    38 
    38         <ul class="floatlist full_width" id="derniers_medias">
    39         <ul class="floatlist full_width" id="derniers_medias">
    39             <li class="li_h2">
    40             <li class="li_h2">
    40                 <h2>Derniers médias</h2>
    41                 <h2>Derniers médias</h2>
    41             </li>
    42             </li>
    42             <li class="cols_4">
    43             <li class="li_media">
    43                 <img src="img/placeholder.png" width="300" height="225" />
    44                 <a href="#"><img src="img/placeholder_16_9.jpg" width="294" height="165" /></a>
    44                 <div class="bulle_annot">250</div>
    45                 <div class="bulle_annot">250</div>
    45                 <p><a href="#"><b>ENMI 2011 - La confiance : Bernard Stiegler</b></a></p>
    46                 <p><a href="#"><b>ENMI 2011 - La confiance : Bernard Stiegler</b></a></p>
    46                 <p>par <a class="under" href="#">IRI</a> | 1h30</p>
    47                 <p>par <a class="under" href="#">IRI</a> | 1h30</p>
    47             </li>
    48             </li>
    48             <li class="cols_4">
    49             <li class="li_media">
    49                 <img src="img/placeholder.png" width="300" height="225" />
    50                 <a href="#"><img src="img/placeholder_16_9.jpg" width="294" height="165" /></a>
    50                 <div class="bulle_annot">250</div>
    51                 <div class="bulle_annot">250</div>
    51                 <p><a href="#"><b>ENMI 2011 - La confiance : Bernard Stiegler</b></a></p>
    52                 <p><a href="#"><b>ENMI 2011 - La confiance : Bernard Stiegler</b></a></p>
    52                 <p>par <a class="under" href="#">IRI</a> | 1h30</p>
    53                 <p>par <a class="under" href="#">IRI</a> | 1h30</p>
    53             </li>
    54             </li>
    54             <li class="cols_4">
    55             <li class="li_media">
    55                 <img src="img/placeholder.png" width="300" height="225" />
    56                 <a href="#"><img src="img/placeholder_16_9.jpg" width="294" height="165" /></a>
    56                 <div class="bulle_annot">250</div>
    57                 <div class="bulle_annot">250</div>
    57                 <p><a href="#"><b>ENMI 2011 - La confiance : Bernard Stiegler</b></a></p>
    58                 <p><a href="#"><b>ENMI 2011 - La confiance : Bernard Stiegler</b></a></p>
    58                 <p>par <a class="under" href="#">IRI</a> | 1h30</p>
    59                 <p>par <a class="under" href="#">IRI</a> | 1h30</p>
    59             </li>
    60             </li>
    60         </ul>
    61         </ul>
       
    62         
       
    63 <!-- MEDIAS LES PLUS ANNOTÉS -->
       
    64 
       
    65         <ul class="floatlist" id="plus_annotes">
       
    66             <li class="li_h2">
       
    67                 <h2>Médias les plus annotés</h2>
       
    68             </li>
       
    69             <li class="li_media">
       
    70                 <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
       
    71                 <div class="bulle_annot">120</div>
       
    72                 <p><a href="#"><b>Lorem Ipsum</b></a></p>
       
    73                 <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
       
    74             </li>
       
    75             <li class="li_media">
       
    76                 <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
       
    77                 <div class="bulle_annot">120</div>
       
    78                 <p><a href="#"><b>Lorem Ipsum</b></a></p>
       
    79                 <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
       
    80             </li>
       
    81             <li class="li_media">
       
    82                 <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
       
    83                 <div class="bulle_annot">120</div>
       
    84                 <p><a href="#"><b>Lorem Ipsum</b></a></p>
       
    85                 <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
       
    86             </li>
       
    87             <li class="li_media">
       
    88                 <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
       
    89                 <div class="bulle_annot">120</div>
       
    90                 <p><a href="#"><b>Lorem Ipsum</b></a></p>
       
    91                 <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
       
    92             </li>
       
    93             <li class="li_media">
       
    94                 <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
       
    95                 <div class="bulle_annot">120</div>
       
    96                 <p><a href="#"><b>Lorem Ipsum</b></a></p>
       
    97                 <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
       
    98             </li>
       
    99             <li class="li_media">
       
   100                 <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
       
   101                 <div class="bulle_annot">120</div>
       
   102                 <p><a href="#"><b>Lorem Ipsum</b></a></p>
       
   103                 <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
       
   104             </li>
       
   105             <li class="li_media">
       
   106                 <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
       
   107                 <div class="bulle_annot">120</div>
       
   108                 <p><a href="#"><b>Lorem Ipsum</b></a></p>
       
   109                 <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
       
   110             </li>
       
   111             <li class="li_media">
       
   112                 <a href="#"><img src="img/placeholder_16_9.jpg" width="134" height="75" /></a>
       
   113                 <div class="bulle_annot">120</div>
       
   114                 <p><a href="#"><b>Lorem Ipsum</b></a></p>
       
   115                 <p class="font_11">par <a class="under" href="#">Ars Industrialis</a> | 1h30</p>
       
   116             </li>
       
   117         </ul>
       
   118 
       
   119 <!-- GROUPES ACTIFS -->
       
   120 
       
   121         <ul class="floatlist" id="groupes_actifs">
       
   122             <li class="li_h2">
       
   123                 <h2>Groupes actifs</h2>
       
   124             </li>
       
   125             <li class="li_media">
       
   126                 <div class="img_groupes_actifs">
       
   127                     <a href="#"><img src="img/placeholder_4_3.jpg" width="54" height="40" /></a>
       
   128                 </div>
       
   129                 <div class="txt_groupes_actifs">
       
   130                     <div class="bulle_people">57</div>
       
   131                     <div class="bulle_annot">32</div>
       
   132                     <p><a href="#" class="under"><b>Regards sur le numérique</b></a></p>
       
   133                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod …</p>
       
   134                 </div>
       
   135             </li>
       
   136             <li class="li_media">
       
   137                 <div class="img_groupes_actifs">
       
   138                     <a href="#"><img src="img/placeholder_4_3.jpg" width="54" height="40" /></a>
       
   139                     <div class="lock_group"></div>
       
   140                 </div>
       
   141                 <div class="txt_groupes_actifs">
       
   142                     <div class="bulle_people">57</div>
       
   143                     <div class="bulle_annot">32</div>
       
   144                     <p><a href="#" class="under"><b>Regards sur le numérique</b></a></p>
       
   145                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod …</p>
       
   146                 </div>
       
   147             </li>
       
   148             <li class="li_media">
       
   149                 <div class="img_groupes_actifs">
       
   150                     <a href="#"><img src="img/placeholder_4_3.jpg" width="54" height="40" /></a>
       
   151                 </div>
       
   152                 <div class="txt_groupes_actifs">
       
   153                     <div class="bulle_people">57</div>
       
   154                     <div class="bulle_annot">32</div>
       
   155                     <p><a href="#" class="under"><b>Regards sur le numérique</b></a></p>
       
   156                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod …</p>
       
   157                 </div>
       
   158             </li>
       
   159             <li class="li_media">
       
   160                 <div class="img_groupes_actifs">
       
   161                     <a href="#"><img src="img/placeholder_4_3.jpg" width="54" height="40" /></a>
       
   162                     <div class="lock_group"></div>
       
   163                 </div>
       
   164                 <div class="txt_groupes_actifs">
       
   165                     <div class="bulle_people">57</div>
       
   166                     <div class="bulle_annot">32</div>
       
   167                     <p><a href="#" class="under"><b>Regards sur le numérique</b></a></p>
       
   168                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod …</p>
       
   169                 </div>
       
   170             </li>
       
   171             <li class="li_media">
       
   172                 <div class="img_groupes_actifs">
       
   173                     <a href="#"><img src="img/placeholder_4_3.jpg" width="54" height="40" /></a>
       
   174                 </div>
       
   175                 <div class="txt_groupes_actifs">
       
   176                     <div class="bulle_people">57</div>
       
   177                     <div class="bulle_annot">32</div>
       
   178                     <p><a href="#" class="under"><b>Regards sur le numérique</b></a></p>
       
   179                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod …</p>
       
   180                 </div>
       
   181             </li>
       
   182         </ul>
    61 
   183 
    62 <!-- FOOTER COMMUN -->
   184 <!-- FOOTER COMMUN -->
    63 
   185 
    64         <ul class="full_width" id="footer">
   186         <ul id="footer">
    65             <li>
   187             <li>
    66                 <a href="#">V.01.15</a>
   188                 <a href="#">V.01.15</a>
    67             </li>
   189             </li>
    68             <li>
   190             <li>
    69                 <a href="#"> © &nbsp;2011 IRI</a>
   191                 <a href="#"> © &nbsp;2011 IRI</a>