diff --git a/map.html b/map.html
index aa0fd02..e46b2df 100644
--- a/map.html
+++ b/map.html
@@ -16,9 +16,15 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
   <!-- Latest compiled JavaScript -->
   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
-  <!--Google map API-->
-
-  
+  <!--Leaflet CSS -->
+  <link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css"
+  integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ=="
+  crossorigin=""/>
+  <!--Leaflet JavaScript (after Leaflet CSS) -->
+  <script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet.js"
+  integrity="sha512-/Nsx9X4HebavoBvEBuyp3I7od5tA0UzAxs+j83KgC8PU0kgB4XiK4Lfe4y4cgBtaRJQEIFCW+oC506aPT2L1zw=="
+  crossorigin=""></script>
+ 
   
 </head>
 
@@ -32,14 +38,22 @@ <h1>Coffee and Code</h1>
   <!--Open Street Map viewer-->
   <div id="map-holder">
       <div class="container-fluid">
-        <div id="map">
-            <iframe width=100% height=600 scrolling="no" marginheight="0" marginwidth=0 src="https://www.openstreetmap.org/export/embed.html?bbox=4.419250488281251%2C52.19961117459449%2C5.346221923828126%2C52.482780222078226&amp;layer=mapnik" style="border: 0px solid white"></iframe><br/><small><a href="https://www.openstreetmap.org/#map=11/52.3414/4.8827">Grotere kaart bekijken</a></small>
+        <div id="mapid">
+             <iframe width=100% height=600 scrolling="no" marginheight="0" marginwidth=0 src="https://www.openstreetmap.org/export/embed.html?bbox=4.419250488281251%2C52.19961117459449%2C5.346221923828126%2C52.482780222078226&amp;layer=mapnik" style="border: 0px solid white"></iframe><br/><small><a href="https://www.openstreetmap.org/#map=11/52.3414/4.8827">Grotere kaart bekijken</a></small>
 
         </div>
       </div>
     </div>
 
-  
+  <script>
+
+  // Initialize the map (default= Location Codaisseur)
+   // initialize the map
+   var map = L.map('mapid').setView([52.370216, 4.895168], 10);
+   var marker = L.marker([52.370216, 4.895168], draggable = false).addTo(map);
+
+
+</script>
 
   
   <!-- Menus below the map -->
diff --git a/mapPageStyle.css b/mapPageStyle.css
index 913e742..0a244bd 100644
--- a/mapPageStyle.css
+++ b/mapPageStyle.css
@@ -3,7 +3,7 @@
 #map
 {
     width: 100px;
-    height:100px;
+    height:30px;
     min-height: 100%;
     min-width: 100%;
     display: block;