<!DOCTYPE html>
<html>
    <head>
      <style>
        path {
          /*fill: #BADA55;*/
          stroke: #FFFFFF;
          stroke-width: 1px;
        }

        .hoverover { 
          font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
        }
        .hoverinfo {
          padding: 4px;
          border-radius: 1px;
          background-color: #FFF;
          box-shadow: 1px 1px 5px #CCC;
          font-size: 12px;
          border: 1px solid #CCC;
        }

        .hoverinfo hr {
          border:1px dotted #CCC;
        }
      </style>
    </head>
    <body>

      <body>

        <link rel="stylesheet" type="text/css" href="lib/jasmine-1.2.0/jasmine.css">
        <script type="text/javascript" src="lib/jasmine-1.2.0/jasmine.js"></script>
        <script type="text/javascript" src="lib/jasmine-1.2.0/jasmine-html.js"></script>
        <div id="container1" style="border:3px dotted blue; height: 350px; width: 660px"></div>


        <!-- Datamaps Source -->
        <script src="../../dist/datamaps.js"></script>

        <!-- Specs -->
        <script type="text/javascript" src="spec/MapSpec.js"></script>

        <!-- Map Generating Function, creates makeMap($el) -->
        <script>
          function makeMap($el) {
            return new Map({
              scope: 'world',
              el: $el,
              geography: {
                highlightBorderColor: '#222',
                highlightOnHover: true
              }
            });
          }
        </script>

        <!-- Jasmine Runner -->
        <script src="lib/runner.js"></script>
        
    </body>
</html>
