diff --git a/src/ClassCodeBundle/Controller/MeetingController.php b/src/ClassCodeBundle/Controller/MeetingController.php
index 4bc95848cc53e28f8e0f6265510dd9ebb2a31474..8e89455dbb11703ba94eb488e75f60c81a3bf7f0 100644
--- a/src/ClassCodeBundle/Controller/MeetingController.php
+++ b/src/ClassCodeBundle/Controller/MeetingController.php
@@ -24,7 +24,7 @@ class MeetingController extends Controller
       $meetingsWithGeoloc =  $em->getRepository('ClassCodeBundle:Meeting')->findAllWithGeoLoc(); 
       return $this->render('@ClassCode/Meeting/list.html.twig', array(
         'meetings' => $meetings,
-        'meetingWithGeolocs' => $meetingsWithGeoloc,
+        'meetingsWithGeoloc' => $meetingsWithGeoloc,
       ));
     }else{
       return  $this->render('@ClassCode/error_auth.html.twig');
@@ -32,20 +32,30 @@ class MeetingController extends Controller
   }
   
   /**
-   * @Route("/querymeetings.{_format}", name="meetingspage",defaults={"_format"="json"},requirements={"_format"="json"}))
+   * @Route("/querymeetings.{_format}", name="querymeetings",defaults={"_format"="json"},requirements={"_format"="json"}))
    */
   public function queryMeetingsAction(Request $request)
   {
     $em = $this->getDoctrine()->getManager();  
     $meetings =  $em->getRepository('ClassCodeBundle:Meeting')->findAll(); 
-    $meetingWithGeoloc =  $em->getRepository('ClassCodeBundle:Meeting')->findAllWithGeoLoc(); 
+    //$meetingWithGeoloc =  $em->getRepository('ClassCodeBundle:Meeting')->findAllWithGeoLoc(); 
     $meetings_array = array();
     $today =  new \DateTime('NOW');
     foreach ($meetings as $m) {
       $tmp_array = array();
       $tmp_location_array = array();
+      $tmp_owner = $m->getOwner();
+      $tmp_facilitator = $tmp_owner->getFacilitator();
+      $tmp_subsribers_array = array();
+      foreach ($m->getSubscribers() as $subscriber) {
+        if($subscriber->getFacilitator()){
+          $tmp_facilitator = true;
+        }
+        $tmp_subsribers_array[]=$subscriber->getUserId();
+      }
+     
       $tmp_array['id'] = $m->getId();
-      $tmp_array['ownerId'] = $m->getOwner()->getUserId();
+      $tmp_array['ownerId'] = $tmp_owner->getUserId();
       $date = \DateTime::createFromFormat('d/m/Y', $m->getDate());
       $tmp_array['date'] = $m->getDate();
       $tmp_array["past"] = !($date != '' && $date > $today);
@@ -67,13 +77,71 @@ class MeetingController extends Controller
       $tmp_location_array['lat'] = $m->getLatitude(); 
       $tmp_location_array['lng'] = $m->getLongitude();  
       $tmp_array['location'] = $tmp_location_array;
+      $tmp_array['facilitateur'] = $tmp_facilitator;
+      $tmp_array['subscribers'] = $tmp_subsribers_array;
       
       $meetings_array[]=$tmp_array;
          
     }
     return $this->render('@ClassCode/Meeting/queryMeetings.json.twig', array(
       'meetings' => $meetings_array,
-      'meetingsWithGeoloc' => $meetingsWithGeoloc,
+    ));
+  }
+
+  /**
+   * @Route("/meetinginfo.{_format}", name="meetinginfo",defaults={"_format"="json"},requirements={"_format"="json"}))
+   */
+  public function metingInfoAction(Request $request)
+  {
+    $em = $this->getDoctrine()->getManager();  
+    $meetingId = ltrim(rtrim($request->query->get("meetingId")));
+    $meeting = array();
+    $today =  new \DateTime('NOW');
+    if(isset($meetingId)&&($meetingId != '')){ 
+      $m =  $em->getRepository('ClassCodeBundle:Meeting')->findOneBy(array('id' =>$meetingId));
+      if($m){
+        $tmp_array = array();
+        $tmp_location_array = array();
+        $tmp_owner = $m->getOwner();
+        $tmp_facilitator = $tmp_owner->getFacilitator();
+        $tmp_subsribers_array = array();
+        foreach ($m->getSubscribers() as $subscriber) {
+          if($subscriber->getFacilitator()){
+            $tmp_facilitator = true;
+          }
+          $tmp_subsribers_array[]=$subscriber->getUserId();
+        }
+        $tmp_array['id'] = $m->getId();
+        $tmp_array['ownerId'] = $tmp_owner->getUserId();
+        $date = \DateTime::createFromFormat('d/m/Y', $m->getDate());
+        $tmp_array['date'] = $m->getDate();
+        $tmp_array["past"] = !($date != '' && $date > $today);
+        $tmp_array["future"] = !($date != '' && $date < $today);
+      
+        $tmp_array['time'] = $m->getTime();
+        $tmp_array['structure'] = $m->getStructure();
+        $tmp_array['hangoutLink'] = $m->getHangoutLink();
+        $tmp_array['capacity'] = $m->getCapacity();
+        $tmp_array['more'] = $m->getMore();
+        $tmp_array['subject'] = $m->getSubject();
+        $tmp_array['precisions'] = $m->getPrecisions();
+        $tmp_location_array['street'] = $m->getStreet();  
+        $tmp_location_array['city'] = $m->getCity(); 
+        $tmp_location_array['zipcode'] = $m->getZipcode(); 
+        $tmp_location_array['state'] = $m->getState(); 
+        $tmp_location_array['country'] = $m->getCountry(); 
+        $tmp_location_array['formattedAddress'] = $m->getFormattedAddress(); 
+        $tmp_location_array['lat'] = $m->getLatitude(); 
+        $tmp_location_array['lng'] = $m->getLongitude();  
+        $tmp_array['location'] = $tmp_location_array;
+        $tmp_array['facilitateur'] = $tmp_facilitator;
+        $tmp_array['subscribers'] = $tmp_subsribers_array;
+      
+        $meeting=$tmp_array;
+      }
+    }
+    return $this->render('@ClassCode/Meeting/meetinginfo.json.twig', array(
+      'meeting' => $meeting,
     ));
   }
 }
diff --git a/src/ClassCodeBundle/Controller/PeopleController.php b/src/ClassCodeBundle/Controller/PeopleController.php
index 1b2a428c917e4579f8db45febe2d73ceffd0f650..e929588025b34ea734cd596209bc73da2914ee91 100644
--- a/src/ClassCodeBundle/Controller/PeopleController.php
+++ b/src/ClassCodeBundle/Controller/PeopleController.php
@@ -18,16 +18,8 @@ class PeopleController extends Controller
   public function indexAction(Request $request)
   {
     if($this->get('security.authorization_checker')->isGranted('ROLE_USER')){
-      //$emp = $this->getDoctrine()->getManager('pixees');
+     
       $em = $this->getDoctrine()->getManager();  
-    //  $ninassi = $emp->getRepository('PixeesBundle:People')->findWithGeoLocBy(265);
-      //$ninassi = $emp->getRepository('PixeesBundle:People')->find(265);
-      
-      
-     // $geoloc = $ninassi->getGeoLoc();
-  
-     // var_dump($ninassi);
-      //$people =  $emp->getRepository('PixeesBundle:People')->findAllWithGeoLoc(); 
       $people =  $em->getRepository('ClassCodeBundle:People')->findAll(); 
       $peopleWithGeoloc =  $em->getRepository('ClassCodeBundle:People')->findAllWithGeoLoc(); 
       return $this->render('@ClassCode/People/list.html.twig', array(
@@ -38,4 +30,44 @@ class PeopleController extends Controller
       return  $this->render('@ClassCode/error_auth.html.twig');
     } 
   }
+   /**
+   * @Route("/queryuserloc.{_format}", name="queryuserloc",defaults={"_format"="json"},requirements={"_format"="json"}))
+   */
+  public function queryUserLocAction(Request $request)
+  {    
+    $userLat = 0;
+    $userLng = 0;
+    $userStreet = "";
+    $userZipCode = "";
+    $userCity = "";
+    $userState = "";
+    $userCountry = "";
+    $userFormattedAddress = "";    
+    $userId = ltrim(rtrim($request->query->get("userId")));   
+    if(isset($userId)&&($userId != '')){
+     $em = $this->getDoctrine()->getManager();  
+     $user = $em->getRepository('ClassCodeBundle:People')->findOneBy(array('userId' =>$userId));
+     if($user){
+       $userLat = $user->getLatitude();
+       $userLng = $user->getLongitude();         
+       $userStreet = $user->getStreet();
+       $userZipCode = $user->getZipcode();
+       $userCity = $user->getCity();
+       $userState = $user->getState();
+       $userCountry = $user->getCountry();
+       $userFormattedAddress = $user->getFormattedAddress();
+     }
+    }
+    return $this->render('@ClassCode/People/queryUserLoc.json.twig', array(
+       'userlat' => $userLat,
+       'userlng' => $userLng,
+       'userStreet' => $userStreet,
+       'userZipcode' => $userZipCode,
+       'userCity' => $userCity,
+       'userCountry' => $userCountry,
+       'userState' => $userState,
+       'userFormattedAddress' => $userFormattedAddress
+      ));  
+    
+  }
 }
diff --git a/src/ClassCodeBundle/Entity/People.php b/src/ClassCodeBundle/Entity/People.php
index 55696a71946ae6831989c8c81e0a7e9b016c15b7..4c1c72dc739ca02ec65b20468fbf9fd71b917a1f 100644
--- a/src/ClassCodeBundle/Entity/People.php
+++ b/src/ClassCodeBundle/Entity/People.php
@@ -773,7 +773,7 @@ class People
      *
      * @return string 
      */
-    public function getFormattedAddres()
+    public function getFormattedAddress()
     {
       return $this->formattedAddress;
     }
diff --git a/src/ClassCodeBundle/Resources/translations/messages.fr.yml b/src/ClassCodeBundle/Resources/translations/messages.fr.yml
index 82ed5cdcee2b64094803639a8eaca05c1b61ef34..fe45f02b79f9455035f32a964a48521cbcf46cad 100644
--- a/src/ClassCodeBundle/Resources/translations/messages.fr.yml
+++ b/src/ClassCodeBundle/Resources/translations/messages.fr.yml
@@ -61,6 +61,7 @@
 'coordination.delete' : "Supprimer cette Coordination"
 'coordination.deleted' : "Coordination Supprimée !"
 'coordination.edited' : "Coordination Editée !"
+'coordination.page' : "Page de la Coordination"
 "partners.list" : "Liste des Partenaires"
 "partner.add" : "Ajouter un Partenaire"
 'partner.edit' : "Modifier un Partenaire"
diff --git a/src/ClassCodeBundle/Resources/views/Coordination/list.html.twig b/src/ClassCodeBundle/Resources/views/Coordination/list.html.twig
index 7dca66f7ae53875789c9ad0531f9c81416abe079..2b0147ffe97cf1b038abdbe076164dc60977e56a 100644
--- a/src/ClassCodeBundle/Resources/views/Coordination/list.html.twig
+++ b/src/ClassCodeBundle/Resources/views/Coordination/list.html.twig
@@ -32,8 +32,19 @@
         {% include '@ClassCode/Coordination/editCoordinationFormModal.html.twig' %}
       </div>
     {% endif %}
-    <div class="col-sm-12">
-      <div id="coordinationsMap" class="osMap" style="height:400px;">        
+    <div class="col-sm-12 map-wrapper">
+      <div id="coordinationsMap" class="osMap" style="height:400px;"> </div>      
+      <div id="classCodeMapOverlay">     
+        <div id="classCodeMapOverlayTitle">           
+          <span id="classCodeMapOverlayTitleContent">Retour</span>
+          <a id="classCodeMapOverlayTitleLink" class="backCriteriaLink">
+            <span class="returnIcon">
+          </span>
+          </a>
+        </div>
+        <div id="classCodeMapOverlayContent">   
+        </div>          
+      </div>  
     </div>
     <div id='coordination_list_div'>
        {% include '@ClassCode/Coordination/ajax_list.html.twig' %}
@@ -53,6 +64,8 @@
  <script type="text/javascript" src="{{ asset('js/leaflet-1.3.1/leaflet.js') }}"></script> 
  <script type="text/javascript" src="{{ asset('js/leaflet-1.3.1/plugins/leaflet.markercluster-1.3.0/dist/leaflet.markercluster.js') }}"></script>
  <script>
+   var overlayShown = false;
+   var lastSelectedMarker = false;
    $(document).ready(function() {    
       loadDataTable();
       $('#loader').hide();
@@ -86,23 +99,53 @@
       var markerDetail = "";
       var lat;
       var lon;
+      var coordinationContentString = '';
+      var coordinationArrayMarker = [];
+      
       {% for coordination in coordinations %} 
         lat = "{{ coordination.getLatitude }}" ;
         lon = "{{ coordination.getLongitude }}" ;
+        coordinationContentString = '';
+        coordinationLogo = "{{ coordination.getLogo }}";
+        if(coordinationLogo != ""){
+          coordinationContentString = '<div class="classCodeMapOverlayContentLogo"><img src="'+coordinationLogo+'"></div>';
+        }       
+        coordinationContentString +=  '<br>';
+        coordinationWho = "{{ coordination.getWho }}";
+        if (coordinationWho != ""){
+          coordinationContentString+=  '<div class="classCodeMapOverlayContentTitle">Contact</div><div class="classCodeMapOverlayEmphasis"><b>'+coordinationWho+'</b></div>';
+        }
+        coordinationAddress = "{{ coordination.getAddress }}";
+        if (coordinationAddress != ""){
+          coordinationContentString+=  '<div>'+coordinationAddress+'</div>';
+        }
+        coordinationEmail = "{{ coordination.getEmail }}";
+        if (coordinationEmail != ""){
+          coordinationContentString+=  '<div><a href="mailto:'+coordinationEmail+'" target="_blank">'+coordinationEmail+'</a></div>';
+        }
+        coordinationUrl = "{{ coordination.getUrl }}";
+        if(coordinationUrl != ""){
+          coordinationContentString+=  '<div><a target="_blank" href="'+coordinationUrl+'">'+coordinationUrl+'</a></div>';
+        }
+        coordinationClassCodePage = "{{ coordination.getClassCodePage }}";
+        if(coordinationClassCodePage != ""){
+          coordinationContentString+=  '<div><a class="classCodeMapOverlayLink" target="_blank" href="'+coordinationClassCodePage+'">{{ 'coordination.page' | trans }}</a></div>';
+        }
+                           
+        
         if((lat !="0")&&(lon != "0")){          
-          markerDetail ="<p class='h4'><b>";
-          markerDetail += "{{ coordination.getName }}";
-          markerDetail += "</b></p>"+ "<p class='h5'><b> " + "{{ coordination.getWho }} " + "</b></p>";
-          markers.addLayer(L.marker(L.latLng(lat, lon)).bindPopup(markerDetail)
-              .openPopup());
-          coordinationMap.addLayer(markers);
+          coordinationArrayMarker[{{ loop.index0 }}] = L.marker(L.latLng(lat, lon), { title: '{{ coordination.getName }}', id: '{{ loop.index0 }}', desc: coordinationContentString } );
+          markers.addLayer(coordinationArrayMarker[{{ loop.index0 }}]);
+          coordinationArrayMarker[{{ loop.index0 }}].on('click',function(event){clickMarker(this,coordinationMap);});                     
         }
       {% endfor %}
+      coordinationMap.addLayer(markers);
       L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
         maxZoom: 18,
         attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
       }).addTo(coordinationMap);
       
+       jQuery("#classCodeMapOverlayTitleLink").click(function() {hideMapOverlay();});
     });
     
     function loadDataTable(){
@@ -287,5 +330,37 @@
         }        
       });
     }
+    
+    function clickMarker(marker,map){
+      var overlay = document.getElementById('classCodeMapOverlay');
+      var overlayTitle = document.getElementById('classCodeMapOverlayTitleContent');
+      var overlayContent = document.getElementById('classCodeMapOverlayContent');
+      if (!overlayShown) {
+        overlayTitle.innerHTML = marker.options.title;
+        overlayContent.innerHTML = marker.options.desc;
+        
+        jQuery("#classCodeMapOverlay").toggle("slow");
+        overlayShown = marker.options.id;
+        lastSelectedMarker = marker.options.id;
+      }else {
+        if (overlayShown != marker.options.id) {
+          overlayTitle.innerHTML = marker.options.title;
+          overlayContent.innerHTML = marker.options.desc;
+   
+          overlayShown = marker.options.id;
+          lastSelectedMarker = marker.options.id;
+        }else{
+          hideMapOverlay();
+        }
+      }
+      //on centre la map sur le marker
+      map.panTo(marker.getLatLng());
+    }
+    
+    function hideMapOverlay(){
+      jQuery("#classCodeMapOverlay").toggle("slow");
+      overlayShown = false;
+      return false;
+    }
  </script>
 {% endblock %} 
\ No newline at end of file
diff --git a/src/ClassCodeBundle/Resources/views/Meeting/list.html.twig b/src/ClassCodeBundle/Resources/views/Meeting/list.html.twig
index 21ba6d2794c8daf138299a8d21ee0850e44786f4..be4b3c79d2a40e677f3a2810f271a9e143e0448c 100644
--- a/src/ClassCodeBundle/Resources/views/Meeting/list.html.twig
+++ b/src/ClassCodeBundle/Resources/views/Meeting/list.html.twig
@@ -76,7 +76,7 @@
       var markerDetail = "";
       var lat;
       var lon;
-      {% for m in meetingWithGeoloc %} 
+      {% for m in meetingsWithGeoloc %} 
         {% if m.getLatitude != 0 and m.getLongitude != 0 %}
           lat = "{{ m.getLatitude }}" ;
           lon = "{{ m.getLongitude }}" ;
diff --git a/src/ClassCodeBundle/Resources/views/Meeting/meetinginfo.json.twig b/src/ClassCodeBundle/Resources/views/Meeting/meetinginfo.json.twig
new file mode 100644
index 0000000000000000000000000000000000000000..430721cc00c1725847d02622387e817dbeb146c4
--- /dev/null
+++ b/src/ClassCodeBundle/Resources/views/Meeting/meetinginfo.json.twig
@@ -0,0 +1,2 @@
+   {{ meeting|json_encode()|raw }}
+
diff --git a/src/ClassCodeBundle/Resources/views/People/queryUserLoc.json.twig b/src/ClassCodeBundle/Resources/views/People/queryUserLoc.json.twig
new file mode 100644
index 0000000000000000000000000000000000000000..514d0330fbb4a5784d13a5a461e80f7fcd4f797a
--- /dev/null
+++ b/src/ClassCodeBundle/Resources/views/People/queryUserLoc.json.twig
@@ -0,0 +1,12 @@
+{ "location":
+    {
+      "lat" : "{{ userlat|raw }}",
+      "lng" : "{{ userlng|raw }}",
+      "street" : "{{ userStreet|raw }}",
+      "zipcode" : "{{ userZipcode|raw }}",
+      "city" : "{{ userCity|raw }}",
+      "country" : "{{ userCountry|raw }}",
+      "state" : "{{ userState|raw }}",
+      "formattedAddress" : "{{ userFormattedAddress|raw }}"
+    }
+}
\ No newline at end of file
diff --git a/src/ClassCodeBundle/Resources/views/Structure/list.html.twig b/src/ClassCodeBundle/Resources/views/Structure/list.html.twig
index 160474ebec5d0d6fed5fcd4ed0b2e96fb21c2a45..635a056de1948e90c29a654d328eff46f1c18f13 100644
--- a/src/ClassCodeBundle/Resources/views/Structure/list.html.twig
+++ b/src/ClassCodeBundle/Resources/views/Structure/list.html.twig
@@ -34,9 +34,18 @@
     {% else %}
       <p class="alert alert-warning">{{ 'structure.login'|trans }}</p>
     {% endif %}
-    <div class="col-sm-12">
-      <div id="structuresMap" class="osMap" style="height:400px;">        
-    </div>
+    <div class="col-sm-12 map-wrapper">
+      <div id="structuresMap" class="osMap" style="height:400px;"></div>
+      <div id="classCodeMapOverlay">     
+        <div id="classCodeMapOverlayTitle">           
+          <span id="classCodeMapOverlayTitleContent">Retour</span>
+          <a id="classCodeMapOverlayTitleLink" class="backCriteriaLink">
+            <span class="returnIcon"></span>
+          </a>
+        </div>
+        <div id="classCodeMapOverlayContent">   
+        </div>  
+      </div>           
     </div>
       <div id='structure_list_div'>
          {% include '@ClassCode/Structure/ajax_list.html.twig' %}
@@ -54,6 +63,8 @@
  <script type="text/javascript" src="{{ asset('js/leaflet-1.3.1/leaflet.js') }}"></script> 
  <script type="text/javascript" src="{{ asset('js/leaflet-1.3.1/plugins/leaflet.markercluster-1.3.0/dist/leaflet.markercluster.js') }}"></script>
  <script>
+   var overlayShown = false;
+   var lastSelectedMarker = false;
    $(document).ready(function() {    
       loadDataTable();
       $('#loader').hide();
@@ -87,18 +98,41 @@
       var markerDetail = "";
       var lat;
       var lon;
+      var structureArrayMarker = [];
+      var structureContentString = '';
       {% for structure in structures %} 
         lat = "{{ structure.getLatitude }}" ;
         lon = "{{ structure.getLongitude }}" ;
-        if((lat !="0")&&(lon != "0")){          
-          markerDetail ="<p class='h4'><b>";
-          markerDetail += "{{ structure.getName }}";
-          markerDetail += "</b></p>"+ "<p class='h5'><b> " + "{{ structure.getWho }} " + "</b></p>";
-          markers.addLayer(L.marker(L.latLng(lat, lon)).bindPopup(markerDetail)
-              .openPopup());
-          structureMap.addLayer(markers);
+        structureContentString= '';
+        structureLogo = "{{ structure.getLogo }}";
+        if(structureLogo != ""){
+          structureContentString = '<div class="classCodeMapOverlayContentLogo"><img src="'+structureLogo+'"></div>';
+        }       
+        structureContentString +=  '<br>';
+        structureWho = "{{ structure.getWho }}";
+        if (structureWho != ""){
+          structureContentString+=  '<div class="classCodeMapOverlayContentTitle">Contact</div><div class="classCodeMapOverlayEmphasis"><b>'+structureWho+'</b></div>';
+        }
+        structureAddress = "{{ structure.getAddress }}";
+        if (structureAddress != ""){
+          structureContentString+=  '<div>'+structureAddress+'</div>';
+        }
+        structureEmail = "{{ structure.getEmail }}";
+        if (structureEmail != ""){
+          structureContentString+=  '<div><a href="mailto:'+structureEmail+'" target="_blank">'+structureEmail+'</a></div>';
+        }
+        structureUrl = "{{ structure.getUrl }}";
+        if(structureUrl != ""){
+          structureContentString+=  '<div><a target="_blank" href="'+structureUrl+'">'+structureUrl+'</a></div>';
+        }
+        
+        if((lat !="0")&&(lon != "0")){      
+          structureArrayMarker[{{ loop.index0 }}] = L.marker(L.latLng(lat, lon), { title: '{{ structure.getName }}', id: '{{ loop.index0 }}', desc: structureContentString } );
+          markers.addLayer(structureArrayMarker[{{ loop.index0 }}]);
+          structureArrayMarker[{{ loop.index0 }}].on('click',function(event){clickMarker(this,structureMap);});     
         }
       {% endfor %}
+      structureMap.addLayer(markers);
       L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
         maxZoom: 18,
         attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
@@ -295,5 +329,36 @@
       });
     }
       
+    function clickMarker(marker,map){
+      var overlay = document.getElementById('classCodeMapOverlay');
+      var overlayTitle = document.getElementById('classCodeMapOverlayTitleContent');
+      var overlayContent = document.getElementById('classCodeMapOverlayContent');
+      if (!overlayShown) {
+        overlayTitle.innerHTML = marker.options.title;
+        overlayContent.innerHTML = marker.options.desc;
+        
+        jQuery("#classCodeMapOverlay").toggle("slow");
+        overlayShown = marker.options.id;
+        lastSelectedMarker = marker.options.id;
+      }else {
+        if (overlayShown != marker.options.id) {
+          overlayTitle.innerHTML = marker.options.title;
+          overlayContent.innerHTML = marker.options.desc;
+   
+          overlayShown = marker.options.id;
+          lastSelectedMarker = marker.options.id;
+        }else{
+          hideMapOverlay();
+        }
+      }
+      //on centre la map sur le marker
+      map.panTo(marker.getLatLng());
+    }
+    
+    function hideMapOverlay(){
+      jQuery("#classCodeMapOverlay").toggle("slow");
+      overlayShown = false;
+      return false;
+    }
  </script>
 {% endblock %} 
\ No newline at end of file
diff --git a/web/css/classcodeadmin.css b/web/css/classcodeadmin.css
index ca45a33c98c745647ad9e2fdfcdcc1408ad7cba2..b48a35140f7ccff95231a2c93a64588b05666ff2 100644
--- a/web/css/classcodeadmin.css
+++ b/web/css/classcodeadmin.css
@@ -637,8 +637,98 @@ li.inline {
 }
 
 /* Map OSM */
-.osMap{
+.map-wrapper{
   margin-top:10px;
   margin-bottom:10px;
 }
- */
\ No newline at end of file
+.osMap{
+  z-index: 2;
+}
+
+/* ClassCodeMapOverlay */
+#classCodeMapOverlay {
+  position: absolute;
+  top: 0px;
+  z-index: 3;
+  background-color: #fff;
+  width: 400px !important;
+  height: 400px !important;
+  display: none;
+  border: 1px solid #CCCCCC;
+  overflow-wrap: break-word;
+}
+
+#classCodeMapOverlayTitle {
+  background-color: #CCCCCC;
+  overflow-wrap: break-word;
+  color: #5E5E5E;
+  padding: 10px 30px 10px 10px;
+  position: relative;
+}
+
+#classCodeMapOverlayContent {
+  font-size: 14px;
+  padding-left: 1%;
+  color: #000;
+  overflow-wrap: break-word;
+}
+
+#classCodeMapOverlayContent div {
+  font-size: 14px;
+  margin-top: 5px;
+  color: #5D5D5D;
+  margin-left: 10px;
+  margin-right: 10px;
+}
+
+#body_container #classCodeMapOverlayContent div a {
+  text-decoration: none;
+  color: #266D83;
+}
+
+#classCodeMapOverlayContent div.classCodeMapOverlayContentLogo {
+  max-width: 230px;
+  max-height: 240px;
+  text-align: center;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+#classCodeMapOverlayContent div.classCodeMapOverlayContentLogo img {
+  border-style: none;
+  max-width: 120px;
+  height: auto;
+}
+
+#classCodeMapOverlayContent div.classCodeMapOverlayContentTitle {
+  color: #CCCCCC;
+  margin-left: 0px;
+}
+
+#classCodeMapOverlayContent div.classCodeMapOverlayEmphasis {
+  font-weight: bold;
+  margin-left: 0px;
+}
+
+#body_container #classCodeMapOverlayContent div a.classCodeMapOverlayLink, a.classCodeMapOverlayModifyLink {
+  color: white;
+  text-decoration: none;
+  display: block;
+  background-color: #27CFD0;
+  padding: 10px 20px;
+  margin: 10px 20px;
+  text-align: left;
+  font-weight: bold;
+}
+
+.returnIcon {
+  position: absolute;
+  right: 10px;
+  top: 10px;
+  background-image: url(../images/croix.png);
+  background-repeat: no-repeat;
+  background-position: center center;
+  display: inline-block;
+  height: 22px;
+  width: 22px;
+}
\ No newline at end of file
diff --git a/web/images/croix.png b/web/images/croix.png
new file mode 100644
index 0000000000000000000000000000000000000000..6969eebd3afdbc98732b85ad7875e7afbe109651
Binary files /dev/null and b/web/images/croix.png differ