#main-container {
  width: 100%;
  max-width: 640px; }

@media only screen and (max-width: 720px) {
  #main-container {
    width: 95%; } }

header #title {
  color: #231f20;
  font-size: 1.7em;
  font-weight: 800;
  font-family: "franklin-gothic-urw", Verdana, Geneva, sans-serif; }

header #subtitle {
  color: #6d6e71;
  font-size: 1.5em;
  font-family: "abril-text", Georgia, "Times New Roman", Times, serif;
  padding: 10px 0 35px; }

header #chatter {
  color: #231f20;
  font-size: 1.5em;
  line-height: 116%;
  font-family: "franklin-gothic-urw", Verdana, Geneva, sans-serif;
  padding-bottom: 20px; }

#map-container {
  max-width: 630px;
  width: 100%;
  height: 370px;
  display: block; }

@media only screen and (max-width: 720px) {
  #map-container {
    display: none; } }

#slider-container {
  max-width: 400px;
  width: 100%;
  margin-top: 15px;
  float: left;
  margin-left: 10px; }

#amtslider {
  max-width: 540px;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  margin: 10px 0 0 30px;
  border: 1px solid #aaaaaa;
  position: relative; }

@media only screen and (max-width: 720px) {
  #amtslider {
    display: none; } }

#amtslider-labels {
  max-width: 540px;
  width: 100%;
  margin: 10px 0 0 10px;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex; }

@media only screen and (max-width: 720px) {
  #amtslider-labels {
    display: none; } }

.year-label {
  font-family: "franklin-gothic-urw", Verdana, Geneva, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  position: relative;
  color: #666; }

input#lbl_arr.lbl_text {
  background-color: #fff;
  max-width: 600px;
  width: 100%;
  margin: 20px auto;
  font-weight: 800;
  font-size: 2.2rem !important;
  text-align: center;
  border: none;
  display: block;
  font-family: "franklin-gothic-urw", Verdana, Geneva, sans-serif; }

@media only screen and (max-width: 720px) {
  input#lbl_arr.lbl_text {
    display: none; } }

.noshadow {
  box-shadow: none !important; }

.lbl_text {
  font-weight: 800;
  font-size: 3.5em;
  text-align: center;
  color: #000 !important;
  border: none;
  font-family: "franklin-gothic-urw", Verdana, Geneva, sans-serif; }

.ui-slider-tick-mark {
  display: inline-block;
  width: 1px;
  background: #aaaaaa;
  height: 9px;
  position: absolute; }

div.ui-slider-range.ui-widget-header.ui-corner-all.ui-slider-range-min,
.ui-slider-tick:nth-of-type(16),
.ui-slider-tick:nth-of-type(17),
.ui-slider-tick:first-of-type {
  background-color: transparent !important; }

.ui-state-default,
.ui-widget-content .ui-state-default {
  border: 1px solid #c5c5c5;
  background: #f6f6f6;
  font-weight: normal;
  color: #454545; }

.ui-slider-horizontal {
  height: 10px;
  border: 0;
  background: none; }

#table-container {
  float: left;
  position: relative;
  right: 0; }

@media only screen and (max-width: 720px) {
  #table-container {
    position: relative;
    bottom: 0; } }

table#state-stats {
  width: 250px;
  clear: both;
  border-collapse: collapse;
  margin-top: 50px;
  font-family: "franklin-gothic-urw", Verdana, Geneva, sans-serif; }
  @media only screen and (max-width: 649px) {
    table#state-stats {
      margin-top: 0; } }

td.label {
  color: #a55a26;
  text-align: left;
  font-weight: 800; }

table tr:first-of-type td {
  border: 0; }

#chart-title {
  color: #231f20;
  font-size: 1rem;
  border-bottom: 1px dotted #231f20;
  padding: 15px 0 5px;
  font-family: "franklin-gothic-urw", Verdana, Geneva, sans-serif; }

#chart-container {
  max-width: 630px;
  width: 100%;
  margin-top: 30px; }

@media only screen and (max-width: 720px) {
  #chart-container {
    width: 95%; } }

#bar-chart {
  max-width: 350px;
  width: 100%;
  height: 200px;
  float: left;
  padding-left: 90px; }

.interactive-footer-container {
  clear: both;
  padding-bottom: 15px; }

.bar {
  width: 10px;
  height: 18px;
  margin: 15px 0;
  background-color: #c3bb9b;
  position: relative;
  -webkit-transition: right 1s;
  transition: right 1s;
  font-family: "franklin-gothic-urw", Verdana, Geneva, sans-serif; }

.bar:before {
  content: attr(data-name);
  position: absolute;
  font-size: 1rem;
  bottom: 0;
  left: -85px;
  width: 80px;
  font-weight: 800;
  text-align: right;
  color: #666;
  -webkit-transition: right 1s;
  transition: right 1s; }

.bar:after {
  content: attr(data-mil);
  position: absolute;
  width: 15px;
  text-align: right;
  font-size: 1rem;
  right: -20px;
  -webkit-transition: right 1s;
  transition: right 1s; }

p#source {
  color: #58585b;
  font-weight: 400;
  line-height: 1.1rem;
  clear: both;
  min-height: 80px;
  padding: 20px 0 5px;
  font-size: 1rem;
  font-family: "franklin-gothic-urw", Verdana, Geneva, sans-serif; }

.nav {
  max-width: 317px;
  width: 100%;
  border: 1px solid #fff;
  height: 25px;
  border-radius: 3px;
  cursor: pointer; }

.nav:focus,
.nav:hover {
  max-width: 317px;
  width: 100%;
  border: 1px solid #ccc;
  height: 35px;
  color: #fff;
  border-radius: 3px;
  cursor: pointer; }

.nav div {
  z-index: -1;
  border: 0 solid #fff;
  height: 23px;
  overflow: hidden;
  padding: 1px 0 0 5px;
  cursor: pointer; }

select.dropdown {
  height: 40px;
  font-size: 18px;
  padding: 10px;
  margin: 15px 15px 15px 0;
  text-transform: uppercase;
  overflow: hidden;
  display: none;
  max-width: 317px;
  width: 100%;
  font-family: "franklin-gothic-urw", Verdana, Geneva, sans-serif;
  z-index: 2;
  cursor: pointer; }

@media only screen and (max-width: 720px) {
  nav select.dropdown {
    display: block;
    width: 95%; } }