4 files changed, 35 insertions, 1 deletions
diff --git a/web/cobrands/fixmystreet/fixmystreet.js b/web/cobrands/fixmystreet/fixmystreet.js
index b490c6177..f638eed9a 100644
--- a/web/cobrands/fixmystreet/fixmystreet.js
+++ b/web/cobrands/fixmystreet/fixmystreet.js
@@ -447,6 +447,8 @@ $.fn.drawer = function(id, ajax) {
             var offset = -18 * 16;
             if (cobrand == 'bromley') {
                 offset = -110;
+            } else if (cobrand == 'oxfordshire') {
+                offset = -110;
             }
             heightFix(window, '.content', offset, 1);
             // in case we have a map that isn't full screen
diff --git a/web/cobrands/oxfordshire/base.scss b/web/cobrands/oxfordshire/base.scss
index d3ba888d9..bb09ba07b 100644
--- a/web/cobrands/oxfordshire/base.scss
+++ b/web/cobrands/oxfordshire/base.scss
@@ -45,3 +45,7 @@
     padding: 1em 1em 0.5em 1em;
 }
 
+dd, p {
+  line-height: 1.4em;
+}
+
diff --git a/web/cobrands/oxfordshire/layout.scss b/web/cobrands/oxfordshire/layout.scss
index e2192180c..366af0522 100644
--- a/web/cobrands/oxfordshire/layout.scss
+++ b/web/cobrands/oxfordshire/layout.scss
@@ -180,4 +180,16 @@ input.green-btn{
   cursor: pointer;
 }
 
+// map instructions (click on 'details' to see details) are a specific requirement from OCC management
+// populated dynamically by position_map.js
+#occ-map-instructions {
+    display: none;
+    position: absolute;
+    color: #666;
+    margin: 0;
+    p {
+      padding: 0.5em;
+    }
+}
+
 @import "oxfordshire";
diff --git a/web/cobrands/oxfordshire/position_map.js b/web/cobrands/oxfordshire/position_map.js
index 9c88d0980..24970a3fe 100644
--- a/web/cobrands/oxfordshire/position_map.js
+++ b/web/cobrands/oxfordshire/position_map.js
@@ -6,13 +6,29 @@ function position_map_box() {
     } else {
         oxfordshire_right = '0em';
     }
+    
+    var map_box_width = 464;
+    var map_box_height = 464;
     // Do the same as CSS (in case resized from mobile).
     $('#map_box').prependTo('.content').css({
         zIndex: 1, position: 'absolute',
         top: '1em', left: '', right: oxfordshire_right, bottom: '',
-        width: '464px', height: '464px',
+        width: map_box_width + 'px', height: map_box_height +'px',
         margin: 0
     });
+    
+    if (1 || ! $('#occ-map-instructions').count) {
+        $('#map_box').after("<div id='occ-map-instructions'><p>" +
+            "Click on a pin and then on the “details” link to see an individual report detail.</p></div>");
+    }
+    var mb_y = $('#map_box').position().top + map_box_height ;
+    $('#occ-map-instructions').show().css({
+        left: '', 
+        right: oxfordshire_right, 
+        bottom: '', 
+        top: mb_y +'px',
+        width: map_box_width
+    });
 }
 
 function map_fix() {}