$(document).ready( function() {

var width = parseInt($('#globe').css('width'));
	
		var height = width * .604;
		
		var color = d3.scale.category10();
		
		var projection = d3.geo.kavrayskiy7()
		    .scale(width * .177)
		    .translate([width / 2, height / 2])
		    .precision(.1);
		
		var path = d3.geo.path()
		    .projection(projection);
		
		var graticule = d3.geo.graticule();
		
		var svg = d3.select("#globe").append("svg")
		    .attr("width", width)
		    .attr("height", height);
		
		svg.append("path")
		    .datum(graticule)
		    .attr("class", "graticule")
		    .attr("d", path);
		
		d3.json("world.json", function(error, world) {
		  var countries = topojson.feature(world, world.objects.countries).features;
		
		  svg.selectAll(".country")
		      .data(countries)
		    .enter().insert("path", ".graticule")
		      .attr("class", "country")
		      .attr("d", path)
		      .style("fill", function(d){
			      if(  d.id == '388' || d.id == '124' || d.id == '634' || d.id == '784' || d.id == '792' || d.id == '724' || d.id == '620' ){
				      return "#CFB705";
			      } else if ( d.id == '840' ){
				      return "#000"
			      } else {
				      return "#304959";
			      }
		      });
		
		  svg.insert("path", ".graticule")
		      .datum(topojson.mesh(world, world.objects.countries, function(a, b) { return a !== b; }))
		      .attr("class", "boundary")
		      .attr("d", path);
		});
		
		d3.select(self.frameElement).style("height", height + "px");
		
});