* {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
  list-style: none;
  text-decoration: none;
}

/* max width setting */
body {
  max-width: 1020px;
  margin: 0 auto;
  float: none;
}



@font-face {
  font-family: Solano Medium;
  src: url("SolanoGothicMVB-MdCap.otf") format("opentype");
}


.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto }



.axis path,
.axis line {
  fill: none;
  stroke-width: .3;
  stroke: #1a1b1e;
  shape-rendering: crispEdges;
}

.axis text {
  font: .6875em/1em Arial, Helvetica, sans-serif;
}

.filter {
  width: 1020px;
  margin: 0 auto;
  overflow: hidden;
}

.filter .brush rect.extent {
  fill: #b4bdbe;
  fill-opacity: .2;
}

.filter .brush .resize path {
  fill: white;
  stroke: #000;
}

.filter #profits-chart,
.filter #revenues-chart.filter {
  float: left;
  width: 50%;
}



.butt{
    position: absolute;
  left: 3%;
    top: 3%;
 
    width: 100px;
    height: 50px;

    z-index: 1;
}

.butt #nozoom,
.butt #zoomin,
.butt #zoomout {
  vertical-align: baseline;
  float: center;
  width: 100%;
  stroke: #666;
}

button {
   display: inline-block; color: #fff; background: #FF0000
; padding: 5px 9px; margin-bottom: 10px; cursor: pointer; border: 2px solid #fff; 
}

/*.filter #rank-chart {
  float: left;
  width: 50%;
}*/

.filter #profits-chart .background.bar,
.filter #revenues-chart .background.bar {
  
  fill: #b4bdbe;
}

/*.filter #rank-chart .background.bar,
.filter #rank-chart .foreground.bar {
  fill: #fff;
}*/

/*.filter #rank-chart .brush rect.extent {
  fill: #1a1b1e;
  fill-opacity: .5;
}*/

.filter #profits-chart .foreground.bar,
.filter #revenues-chart .foreground.bar {
  fill: #FF0000;
}

h3 {
  padding-top: 5px;
  font: bold .9em/.9em Arial, Helvetica, sans-serif;
  color: #1a1b1e;
  text-align: center;
}

h3 span {
  color: #aaabae;
}

h2 {
  padding-top: 10px;
  font: 2em/1.5em "Solano Medium", sans-serif;
  color: #FF0000;
  display: inline-block;
  margin: 0 0px;
}

h2 span {
  color: #aaabae;
}

.main {
  font: 1em/1.3em Georgia, Times, 'Times New Roman', serif;
  color: #7a7b7e;
  margin: 0 auto;
  padding-top: 0px;
}

p {
  margin: 0 auto;
  padding-top: 10px;
  padding-bottom: 5px;
  font: 1em/1.3em Georgia,Times,"Times New Roman",serif;
  color: #7A7B7E;
  margin-left: 0px;
  margin-right: 0px;
}

#map {

  clear: both;
  width: 96%;
  height: 470px;
  margin: 10px auto;
  text-align: center;
  overflow: hidden;
}

p#bottom {
  text-align: center;
  font: bold 1em/.2em Arial, Helvetica, sans-serif;
  color: #1a1b1e;
}

p#bottom span#active {
  display: inline-block;
  color: #FF0000;
}

.tooltip {
  position: absolute;
  width: 180px;
  padding: 15px;
  font: 0.75em/1em sans-serif;
  color: #1a1b1e;
  background: white;
  border: 2px solid #1a1b1e;
  border-radius: 0px;
  pointer-events: none;
}

.tooltip .boldDetail {
  font-weight: bold;
}

.tooltip .normalDetail {
  font-weight: normal;
}

.blurb-container {
  margin-left: 10px;
  margin-right: 10px;
}

/*#chart-iframe {*/
/*  margin-left: 10px;*/
/*  margin-right: 10px;*/
/*}*/

#map-credit {
  font-size: 0.6em;
  margin-bottom: 1em;
}

#nozoom {
  color: #FF0000;
  text-align: center;
  font-size: 0.6em;
}

.map-container-main {
  position: relative;
}

.map-bottom-blurb {
  border-bottom: 1px dotted #aaabae;
}




@media only screen
  and (max-width: 1000px) {
  .filter, p#bottom, h3 {
    display: none;
  }
}




/* tablet portrait */
@media only screen
  and (min-device-width: 730px)
  and (max-device-width: 1024px)
  and (-webkit-min-device-pixel-ratio: 1)
  and (orientation: portrait) {
    .map-filter-c {
      text-align: center;
    }
    .filter {
      width: 100%;
    }
    .filter>#profits-chart {
      float: none;
      width: 100%;
    }
    #map {
      width: 80%;
    }
}

/* phone portrait */
@media only screen
  and (min-device-width: 320px)
  and (max-device-width: 729px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {

  .filter, p#bottom, h3 {
    display: none;
  }

  .main {
    width: 100%;
  }

  #map {
    width: 80%;
    height: 320px;
  }

  .map-bottom-blurb {
    border-bottom: none;
  }
}

/* phone landscape */

@media only screen
  and (min-device-width: 320px)
  and (max-device-width: 729px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {

  .filter, p#bottom, h3 {
    display: none;
  }

  .main {
    width: 95%;
  }

  .map-bottom-blurb {
    border-bottom: none;
  }
}