.wrapper {
  font-family: "franklin-gothic-urw", sans-serif;
  font-size: 14px;
  color: #231F20;
  width: 980px;
  margin: 10px auto; }

.header {
  width: 100%;
  height: 153px;
  float: left;
  overflow: hidden; }
  .header .left {
    float: left; }
    .header .left .logo {
      float: left;
      height: 80px; }
    .header .left .title {
      float: left;
      border-left: 1px solid #868787;
      height: 60px;
      margin-left: 15px;
      padding-left: 15px;
      margin-top: 10px;
      color: #868787;
      font-size: 21px;
      line-height: 25px;
      font-weight: 700; }
  .header .right {
    float: right; }
    .header .right .map {
      width: 590px;
      height: 153px;
      height: 250px; }

.chart {
  float: left;
  width: 980px;
  height: 480px;
  position: relative; }
  .chart .sliderInfo {
    position: absolute;
    bottom: 30px;
    left: 0px; }
    .chart .sliderInfo img {
      float: left;
      clear: left;
      margin: 2px 0 0 10px; }
    .chart .sliderInfo .txt {
      width: 150px;
      float: left;
      margin-top: 2px;
      font-size: 11px;
      line-height: 12px; }
  .chart .testText {
    display: none;
    color: #000;
    background-color: none;
    font-size:12px;
    padding: 2px;
    position: absolute;
    bottom: 37px;
    right: -10px;
    text-align:center; }
  .chart .testText img { 
	  width:12px !important;    
	  vertical-align:bottom; }
  .chart .globalXAxisLabel {
    position: absolute;
    bottom: 1px;
    left: 8px;
    font-size: 10px;
    color: #B21C24;
    font-family: arial; }
    .chart .globalXAxisLabel.current {
     left: 892px; 
     display:none !important;}

.debug {
  position: absolute;
  top: 20px;
  left: 300px;
  width: 300px;
  height: auto;
  border: 1px solid #888;
  background: rgba(255, 255, 255, 0.8);
  text-align: center; }

.axis {
  font: 10px sans-serif; }

.axis path, .axis line {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges; }

.y.axis line {
  stroke: #8d8d8d; }

.y.axis path {
  stroke: none; }

.bar.current {
  fill-opacity: 1 !important; }

.instructions {
  float: left;
  font-size: 12px;
  margin: -25px 0 0 384px;
  font-weight: 700; }

.flagInfo {
  font-size: 12px;
  float: left;
  margin-top: -25px; }

.buttons {
  float: right;
  margin: -30px 45px 0 0;
  display: inline-block;
  position: relative;
  background-color: #E0DFDF;
  border: 1px solid #62605F;
  border-radius: 5px;
  height: 20px;
  width: 150px; }
  .buttons div {
    display: inline;
    position: absolute;
    right: -1px;
    top: -1px;
    cursor: pointer;
    height: 16px;
    padding: 2px 5px;
    color: #97999C;
    font-size: 11px;
    line-height: 20px;
    text-transform: uppercase;
    margin-left: -5px; }
  .buttons div.current {
    color: steelblue;
    font-weight: 700;
    color: #231F20;
    background-color: #fff;
    border: 1px solid #62605F;
    border-radius: 5px;
    line-height: 18px; }
  .buttons div.line {
    right: 73px; }
  .buttons div:hover {
    color: #231F20; }

.countryIcons {
  float: left;
  width: 100%; }
  .countryIcons .icon {
    float: left;
    width: 81px;
    margin-right: 14px;
    cursor: pointer; }
    .countryIcons .icon:hover {
      opacity: 0.8; }
    .countryIcons .icon .checkbox {
      float: left;
      margin-bottom: 5px;
      height: 11px;
      position: relative;
      display: none; }
      .countryIcons .icon .checkbox .box {
        border: 1px solid #F58029;
        background-color: #fff;
        width: 11px;
        height: 11px;
        position: absolute;
        z-index: 1; }
      .countryIcons .icon .checkbox .check {
        position: absolute;
        z-index: 2;
        top: -5px;
        left: 3px;
        background-image: url(../images/check.png);
        width: 15px;
        height: 16px; }
    .countryIcons .icon .bar {
      float: left;
      clear: left;
      height: 13px;
      width: 100%;
      background: #333;
      margin-bottom: 5px;
      transition-duration: 0.5s; }
      .countryIcons .icon .bar .num {
        color: #fff;
        width: 100%;
        text-align: center;
        font-size: 12px; }
    .countryIcons .icon .flag {
      float: left;
      clear: left;
      width: 100%;
      height: 44px;
      transition-property: filter;
      transition-duration: 0.3s;
      -webkit-transition: -webkit-filter;
      -webkit-transition-duration: 0.3s; }
    .countryIcons .icon .txt {
      font-family: "franklin-gothic-urw-comp";
      font-size: 16px; }
  .countryIcons .icon.global .bar {
    background: #F58029; }
  .countryIcons .icon.global .flag {
    background-image: url(../images/flag_global.png); }
  .countryIcons .icon.us .box {
    border-color: #007DC1; }
  .countryIcons .icon.us .bar {
    background: #007DC1; }
  .countryIcons .icon.us .flag {
    background-image: url(../images/flag_us.png); }
  .countryIcons .icon.russia .box {
    border-color: #EF3E23; }
  .countryIcons .icon.russia .bar {
    background: #EF3E23; }
  .countryIcons .icon.russia .flag {
    background-image: url(../images/flag_russia.png); }
  .countryIcons .icon.uk .box {
    border-color: #2E3192; }
  .countryIcons .icon.uk .bar {
    background: #2E3192; }
  .countryIcons .icon.uk .flag {
    background-image: url(../images/flag_uk.png); }
  .countryIcons .icon.france .box {
    border-color: #6C5CA8; }
  .countryIcons .icon.france .bar {
    background: #6C5CA8; }
  .countryIcons .icon.france .flag {
    background-image: url(../images/flag_france.png); }
  .countryIcons .icon.china .box {
    border-color: #FFCB05; }
  .countryIcons .icon.china .bar {
    background: #FFCB05; }
  .countryIcons .icon.china .flag {
    background-image: url(../images/flag_china.png); }
  .countryIcons .icon.israel .box {
    border-color: #4EADE1; }
  .countryIcons .icon.israel .bar {
    background: #4EADE1; }
  .countryIcons .icon.israel .flag {
    background-image: url(../images/flag_israel.png); }
  .countryIcons .icon.india .box {
    border-color: #CC942E; }
  .countryIcons .icon.india .bar {
    background: #CC942E; }
  .countryIcons .icon.india .flag {
    background-image: url(../images/flag_india.png); }
  .countryIcons .icon.pakistan .box {
    border-color: #00A651; }
  .countryIcons .icon.pakistan .bar {
    background: #00A651; }
  .countryIcons .icon.pakistan .flag {
    background-image: url(../images/flag_pakistan.png); }
  .countryIcons .icon.northKorea .box {
    border-color: #000; }
  .countryIcons .icon.northKorea .bar {
    background: #000; }
  .countryIcons .icon.northKorea .flag {
    background-image: url(../images/flag_northKorea.png); }
  .countryIcons .icon.inactive .checkbox {
    visibility: hidden; }
  .countryIcons .icon.inactive .bar {
    background: #C9CACC; }
  .countryIcons .icon.inactive .flag {
    opacity: 0.5;
    -moz-filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
    -o-filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
    -webkit-filter: grayscale(100%);
    filter: gray;
    filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale"); }

.clockInfo {
  position: absolute;
  z-index: 10;
  top: 20px;
  left: 0;
  width: 330px;
  height: auto; }
  .clockInfo .info {
    display: none; }
    .clockInfo .info .title {
      font-size: 18px;
      font-weight: 700; }
    .clockInfo .info .details {
      color: #808285;
      font-size: 15px; }
      .clockInfo .info .details img {
        float: left;
        margin: 0 5px 5px 0; }

.shadow {
  float: left;
  clear: left;
  width: 100%;
  height: 46px;
  background-image: url(../images/shadow.png); }

.chart .shadow {
  position: absolute;
  z-index: 1; }

.chart .drag {
  position: absolute;
  background-image: url(../images/widget.png);
  width: 31px;
  height: 30px;
  cursor: move;
  bottom: -5px;
  left: 0px;
  z-index: 100; }
  .chart .drag .txt {
    color: #fff;
    text-align: center;
    line-height: 30px;
    font-weight: 300;
    line-height: 34px;
    pointer-events: none; }

.chart .tooltips {
  position: absolute;
  z-index: 20;
  width: 65px;
  height: 100%;
  top: 20px; }
  .chart .tooltips .tt {
    position: relative;
    max-width: 65px;
    height: 20px;
    line-height: 20px;
    float: left;
    clear: left;
    color: #fff;
    padding: 0 5px;
    margin-bottom: 2px;
    display: none; }
    .chart .tooltips .tt.Global {
      background-color: #F58029; }
    .chart .tooltips .tt.US {
      background-color: #007DC1; }
    .chart .tooltips .tt.Russia {
      background-color: #EF3E23; }
    .chart .tooltips .tt.UK {
      background-color: #2E3192; }
    .chart .tooltips .tt.France {
      background-color: #6C5CA8; }
    .chart .tooltips .tt.China {
      background-color: #FFCB05; }
    .chart .tooltips .tt.Israel {
      background-color: #4EADE1; }
    .chart .tooltips .tt.India {
      background-color: #CC942E; }
    .chart .tooltips .tt.Pakistan {
      background-color: #00A651; }
    .chart .tooltips .tt.NorthKorea {
      background-color: #000; }

.datamaps-subunit.USA, .datamaps-subunit.RUS, .datamaps-subunit.GBR, .datamaps-subunit.FRA, .datamaps-subunit.CHN, .datamaps-subunit.ISR, .datamaps-subunit.IND, .datamaps-subunit.PAK, .datamaps-subunit.PRK {
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  fill: #F58029 !important; }

.datamaps-subunit.active.USA {
  fill: #007DC1 !important; }

.datamaps-subunit.active.RUS {
  fill: #EF3E23 !important; }

.datamaps-subunit.active.GBR {
  fill: #2E3192 !important; }

.datamaps-subunit.active.FRA {
  fill: #6C5CA8 !important; }

.datamaps-subunit.active.CHN {
  fill: #FFCB05 !important; }

.datamaps-subunit.active.ISR {
  fill: #4EADE1 !important; }

.datamaps-subunit.active.IND {
  fill: #CC942E !important; }

.datamaps-subunit.active.PAK {
  fill: #00A651 !important; }

.datamaps-subunit.active.PRK {
  fill: #000 !important; }

.grid rect {
  stroke: #fff;
  stroke-opacity: 0.5;
  fill: none;
  fill-opacity: 0.4;
  shape-rendering: crispEdges; }

.grid.grey rect {
  fill: #e2e2e2; }

.notes {
  /*font-size: 11px;*/
  float: left;
  margin: 10px 0; }
  .notes a {
    text-decoration: none;
    color: #B21C24; }