Styling unoptimized markers in Google Maps

Unoptimized markers exist as img elements inside the markerLayer mapPane.

(If your markers didn't had the optimized:false property, they will render inside a canvas element and won't be CCS stylable)

To get a reference to the markerLayer mapPane

  var myoverlay = new google.maps.OverlayView();
  myoverlay.draw = function () {
    //this assigns an id to the markerlayer Pane, so it can be referenced by CSS
    this.getPanes().markerLayer.id='markerLayer'; 
  };
  myoverlay.setMap(map);

if you defined a CSS style for #markerLayer img, it will be applied to your markers.

<!DOCTYPE html>
<html>
  <head>
    <title>Simple Map</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <style>
      html, body, #map-canvas {
        height: 500px;
        width:960px;
        margin: 0px;
        padding: 0px
      }
      #markerLayer img {
        border: 2px solid red !important;
        width: 85% !important;
        height: 90% !important;
        border-radius: 5px;
      }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
    <script>
    var map;

// I create an OverlayView, and set it to add the "markerLayer" class to the markerLayer DIV
     var myoverlay = new google.maps.OverlayView();
     myoverlay.draw = function () {
         this.getPanes().markerLayer.id='markerLayer';
     };
     myoverlay.setMap(map);

}

google.maps.event.addDomListener(window, 'load', initialize);

</script>
  </head>
  <body>
    <div id="map-canvas"></div>
  </body>
</html>

https://maps.googleapis.com/maps/api/js?v=3.exp