#interactive {
  max-width: 588px;
  line-height: 1.4;
  margin: 0.5em 0;
  border-top: 1px solid #c7c7c7;
  border-bottom: 1px solid #c7c7c7;
  padding: 0.5em 0;
  /* column header and repeating column header styles */
  /* set width and style table cells */
  /* table typeface styles */
  /* map/table legend styles */
  /* state column styles */
  /* restrict width of state column*/
  /* style svg maps */
  /* hide label for n/a empty cells */
  /* specify svg map and data table color palette for this project's data categories */
  /* desaturate map colors for the table cell backgrounds */
  /* global */
  /* map */
  /* header and legend */
  /* map interaction styling */
  /* tooltips */
  /* sourceline */
  /* fade */
  /*  project-specific styles */ }
  #interactive table#mapTable {
    table-layout: fixed;
    padding: 0;
    overflow: hidden;
    margin-left: 0;
    margin-right: 0;
    clear: both;
    border-collapse: collapse;
    color: #292929; }
  #interactive #mapTable thead th {
    font-size: 15px;
    text-align: center;
    text-transform: none;
    width: 2em;
    line-height: normal;
    margin-bottom: .5em; }
  #interactive #mapTable th {
    white-space: normal;
    overflow: hidden;
    position: relative;
    width: 22%;
    min-width: 22%;
    display: block;
    float: left;
    font-size: 11px;
    padding: 0; }
  #interactive #mapTable .mid_labels th {
    background: black;
    height: 1em;
    padding: 1em 0em;
    color: white;
    text-align: center; }
  #interactive .stateRows th {
    background: #f7f7f7;
    height: 8em;
    border-right: 1px solid white;
    border-bottom: 1px solid white; }
  #interactive #mapTable p {
    display: table-cell;
    margin: 0 auto;
    text-transform: none;
    line-height: normal;
    padding: 8px;
    word-break: break-word; }
  #interactive #mapTable #legend {
    line-height: 12px; }
  #interactive #mapTable .swatch {
    display: block;
    width: 90%;
    height: 12px;
    padding: 3px;
    font-weight: 600;
    text-align: center;
    font-size: 10px;
    text-transform: none;
    font-weight: bold; }
  #interactive #mapTable .state_name {
    width: 5%;
    min-width: 10%;
    text-align: right;
    color: #222222;
    padding: 0 5px 0 0; }
  #interactive th:nth-of-type(1) {
    display: table-cell;
    width: 5% !important;
    min-width: 10% !important; }
  #interactive #mapTable svg path {
    fill: #e0e0e0; }
  #interactive #mapTable .svg_container {
    position: relative;
    padding-bottom: 62%;
    height: 0;
    overflow: hidden;
    margin-bottom: -25px; }
  #interactive #mapTable .svg_container svg {
    width: 75%;
    height: 75%;
    /* FIX for FF keep the svg near the th */
    position: absolute;
    left: 15%; }
  #interactive .inline_label {
    display: none; }
  @media only screen and (max-width: 480px) {
    #interactive #mapTable,
    #interactive tbody,
    #interactive tr,
    #interactive #mapTable td,
    #interactive #mapTable th,
    #interactive #mapTable tbody.state_name,
    #interactive #mapTable th.legal,
    #interactive #mapTable th.banned,
    #interactive #mapTable th.limbo,
    #interactive #mapTable th.bannedstrong {
      display: block !important;
      background: none;
      width: 83% !important;
      border: 0; }
    #interactive table#mapTable {
      width: 26em !important; }
    #interactive #mapTable {
      table-layout: auto; }
    #interactive #mapTable .svg_container {
      padding-bottom: 0; }
    #interactive #mapTable th {
      border: none;
      text-align: left;
      font-weight: normal;
      line-height: 1.5em;
      position: relative;
      padding: 5px !important;
      margin-bottom: 0px; }
    #interactive th:nth-of-type(2):before {
      content: "Constitutional amendment:";
      font-weight: bold;
      color: #888; }
    #interactive th:nth-of-type(3):before {
      content: "Court action: ";
      font-weight: bold;
      color: #888; }
    #interactive th:nth-of-type(4):before {
      content: "Legislative action: ";
      font-weight: bold;
      color: #888; }
    #interactive th:nth-of-type(5):before {
      content: "Popular vote: ";
      font-weight: bold;
      color: #888; }
    #interactive #mapTable .state_name {
      font-weight: bold;
      text-transform: uppercase;
      text-align: left; }
    #interactive #mapTable tr {
      padding-bottom: 5px;
      margin-bottom: 5px; }
    #interactive #mapTable svg .legal,
    #interactive #mapTable svg .banned,
    #interactive #mapTable svg .limbo,
    #interactive #mapTable svg .bannedstrong {
      background-color: transparent;
      fill: transparent; }
    #interactive tr:nth-of-type(odd) {
      background: #f7f7f7; }
    #interactive #mapTable thead,
    #interactive #mapTable .mid_labels {
      display: none !important; }
    #interactive #mapTable p {
      padding: 0;
      margin: 0 !important; }
    #interactive .inline_label {
      display: block; } }
  #interactive #mapTable svg .legal, #interactive #mapTable .legal, #interactive #mapTable #legal, #interactive #mapTable svg .Legal, #interactive #mapTable .Legal, #interactive #mapTable #Legal {
    fill: rgba(67, 147, 195, 0.8);
    background: rgba(67, 147, 195, 0.8); }
  #interactive #mapTable svg .limbo, #interactive #mapTable .limbo, #interactive #mapTable #limbo, #interactive #mapTable svg .Limbo, #interactive #mapTable .Limbo, #interactive #mapTable #Limbo {
    fill: #abd9e9;
    background: #abd9e9; }
  #interactive #mapTable svg .banned, #interactive #mapTable .banned, #interactive #mapTable #banned, #interactive #mapTable svg .Banned, #interactive #mapTable .Banned, #interactive #mapTable #Banned {
    fill: #f4a582;
    background: #f4a582; }
  #interactive #mapTable svg .bannedStrong, #interactive #mapTable #bannedStrong, #interactive #mapTable .bannedStrong, #interactive #mapTable svg .bannedstrong, #interactive #mapTable #bannedstrong, #interactive #mapTable .bannedstrong,
  #interactive #mapTable svg .BannedStrong, #interactive #mapTable #BannedStrong, #interactive #mapTable .BannedStrong, #interactive #mapTable svg .Bannedstrong, #interactive #mapTable #Bannedstrong, #interactive #mapTable .Bannedstrong {
    fill: #d6604d;
    background: #d6604d; }
  #interactive #map_container {
    margin: 0 auto;
    font-weight: inherit; }
  #interactive #map_container header, #interactive #map_container svg, #interactive #map_container section {
    margin-bottom: 1em; }
  #interactive #map_container > header *, #interactive #map_container > section * {
    margin: 0em;
    margin-bottom: .2em;
    line-height: 1.4; }
  #interactive #map_container svg {
    width: 100%;
    max-height: 100%; }
  #interactive #map_container header {
    text-align: left; }
  #interactive #map_container h2 {
    font-weight: bold;
    font-size: 1.8em; }
  #interactive #map_container dl {
    margin-top: .6em;
    font-weight: lighter;
    line-height: 1.8em; }
  #interactive #map_container dt, #interactive #map_container dd {
    display: inline; }
  #interactive #map_container dt {
    margin-right: 3px; }
  #interactive #map_container dd {
    padding-right: 1em; }
  #interactive #map_container .clickable {
    cursor: pointer; }
  #interactive #map_container #state_specific_area {
    width: 90%;
    margin: 0 auto;
    line-height: 125%;
    background: #f7f7f7;
    padding: 1em; }
  #interactive #map_container aside {
    font-size: .8em; }
  #interactive #map_container .fade-out {
    opacity: 0;
    transition-property: opacity;
    transition-duration: 0.3s ease-in-out;
    -moz-transition: opacity 0.3s ease-in-out;
    -webkit-transition: opacity 0.3s ease-in-out; }
  #interactive #map_container .fade-in {
    opacity: 1;
    transition-property: opacity;
    transition-duration: 0.3s ease-in-out;
    -moz-transition: opacity 0.3s ease-in-out;
    -webkit-transition: opacity 0.3s ease-in-out; }
  #interactive #map_container .Legal {
    fill: #03436A;
    background: #03436A;
    color: #03436A; }
  #interactive #map_container .Appeal {
    fill: #3D9AD1;
    background: #3D9AD1;
    color: #3D9AD1; }
  #interactive #map_container .Challenged {
    fill: #FFA940;
    background: #FFA940;
    color: #FFA940; }
  #interactive #map_container .Banned {
    fill: #A65B00;
    background: #A65B00;
    color: #A65B00; }
