body {
    margin: 0;
    padding: 0;
    position: relative;0
    width: 951px;
	font: bold 18px/130% Arial, Helvetica, sans-serif;
	background-color:#6f7d98;
}

#legend {
    font-size: 10pt;
    left: 10px;
    position: absolute;
    top: 320px;
    z-index: 50;
	padding:10px;}
    #legend caption {
        font-weight: bold;
        padding-bottom: 5px;
    }
    #legend td {
        cursor: pointer;
        padding-right: 15px;
		margin-bottom:5px;
		font-size:15px;
		
    }

#country_list {
    position: absolute;
    left: 10px;
    top: 10px;
	font-size:18px;
	padding:5px;
}

area {cursor: pointer;}

#quantile_countries {
    font-size: 10pt;
    left: 10px;
    padding: 0px;
    position: absolute;
    top: 60px;
}

.country_ranks, {top:100px;
	position:absolute;}

.country_ranks li {
    list-style: none;
    margin-left: -10px;
    padding-right: 10px;
	font:11px/110% Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	}


.triangle_right {
    /* this works?! thanks, http://css-tricks.com/examples/ShapesOfCSS/ */
    border-top: 0.5em solid transparent;
    border-bottom: 0.5em solid transparent;
    border-left: 0.5em solid black;
    float: left;
    height: 0;
    margin-right: 0.25em;
    margin-top: 3px;
    width: 0;
	font-weight:bold;
}

#country_selected {margin-left: -0.75em; font-weight:bold;}

#quiz {
    font-size: 10pt;
    left: 465px;
    padding: 10px;
    position: absolute;
    top: 10px;
    width: 400px;
	font-size:16px;
}

#quiz a {color:#1466e2; text-decoration:none; font-weight:bold; font-size:18px; text-shadow: 1px 1px 3px #fff;}

#quiz p { font:20px/120& Arial, Helvetica, sans-serif; text-shadow: 1px 1px 3px #fff; margin-bottom:5px;}
    #quiz_choices, #quiz_choices li {
        list-style: none;
        margin: -7px 0 0 0;
        padding: 0;
    }
        #quiz_choices li {
            float: left;
            padding: 5px;
            width: 130px;
        }
    #question {margin: 0 0 5px 0; line-height:120%; font-size:18px;}
    #quiz_end {
        clear: both;
        padding: 10px 0 5px 0;
    }
    #quiz_correct {
        float: left;
        margin: 0 5px 0 0;
    }
    #quiz_reset {margin: 0;}

#legend, #quantile_countries, #quiz {
  background-color: transparent;
  background-color: rgba(255, 255, 255, 0.5);  /* FF3+, Saf3+, Opera 10.10+, Chrome, IE9 */
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#99B4B490,endColorstr=#99B4B490); /* IE6–IE9 */
            zoom: 1;
			-webkit-border-radius: 12px; /* Saf3-4, iOS 1-3.2, Android <1.6 */
     -moz-border-radius: 12px; /* FF1-3.6 */
          border-radius: 12px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */
          
  /* useful if you don't want a bg color from leaking outside the border: */        
  -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; 
}

.map { position:absolute; top:65px;}