@import url("smoothness/jquery-ui-1.10.4.custom.css");
@import url("jquery.dataTables.css");
/*@import url("dataTables.fixedColumns.min.css");*/
@import url("fontello/css/fontello.css");

/** Transitions ***************************************************************/
* {
  /* these cause conflict with Highcharts animations */
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
  -webkit-transition: none !important;
  transition: none !important;
}

.tooltip {
  position: absolute;
  z-index: 1030;
  display: block;
  visibility: visible;
  font-size: 12px;
  line-height: 1.4;
  opacity: 0;
  filter: alpha(opacity=0); }

.tooltip.in {
  opacity: 0.9;
  filter: alpha(opacity=90); }

.tooltip.top {
  margin-top: -3px;
  padding: 5px 0; }

.tooltip.right {
  margin-left: 3px;
  padding: 0 5px; }

.tooltip.bottom {
  margin-top: 3px;
  padding: 5px 0; }

.tooltip.left {
  margin-left: -3px;
  padding: 0 5px; }

.tooltip-inner {
  max-width: 200px;
  padding: 3px 8px;
  color: #ffffff;
  text-align: center;
  text-decoration: none;
  background-color: #000000;
  border-radius: 4px; }

.tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid; }

.tooltip.top .tooltip-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000000; }

.tooltip.top-left .tooltip-arrow {
  bottom: 0;
  left: 5px;
  border-width: 5px 5px 0;
  border-top-color: #000000; }

.tooltip.top-right .tooltip-arrow {
  bottom: 0;
  right: 5px;
  border-width: 5px 5px 0;
  border-top-color: #000000; }

.tooltip.right .tooltip-arrow {
  top: 50%;
  left: 0;
  margin-top: -5px;
  border-width: 5px 5px 5px 0;
  border-right-color: #000000; }

.tooltip.left .tooltip-arrow {
  top: 50%;
  right: 0;
  margin-top: -5px;
  border-width: 5px 0 5px 5px;
  border-left-color: #000000; }

.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000000; }

.tooltip.bottom-left .tooltip-arrow {
  top: 0;
  left: 5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000000; }

.tooltip.bottom-right .tooltip-arrow {
  top: 0;
  right: 5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000000; }

.percent {
  display: none;
  white-space: pre-wrap;
  /*font-weight:bold;*/
}

/*.percent:before {
  font-weight:normal;
}

.percent.total:before {
  font-weight:bold;
}*/

.cf:before,
.cf:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */ }

.cf:after {
  clear: both; }

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf {
  *zoom: 1; }

.browse {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0; }

.titletext {
  text-decoration: none;
  color: #356697; }

.dataTables_scroll {
  overflow: scroll;
  border-left: 1px solid #d3d3d3;
  border-right: 1px solid #d3d3d3;
  font-size: 12px; }

.null {
  z-index: 1; }

#dl {display:none; text-align:center;margin-top:15px;}

td select {
  font-size: .8em; }

.total, .grosstotal {
  color: black !important;
  margin-top: 0.5em !important;
  border-top: 1px solid #000000; 
}

.nettotal {
  color: black !important; }

.highcharts-tooltip {
  z-index: 11111 !important; }

/*styles for chartindex*/
#asideMenu {margin-top:15px;}
.col #asideButtons .sidebutton {margin-left:0;}
.chartHolder {
  margin-top: 1em;
  float: left;
  display: block;
  margin-right: 2.35765%;
  width: 100%; }

.chartHolder:last-child {margin-right: 0;}

.chartHolder .chartgroup {
  background-color: rgba(200, 200, 200, 0.1);
  margin-top: 1em;
  text-align: center;
  padding: 1em;
  border: 1px solid #aaa; }

@media screen and (min-width: 720px) {
  .chartHolder .chartgroup {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 23.23176%;
    clear: none !important;
    margin-right: 3px !important;
    height: 225px; }
    .chartHolder .chartgroup:last-child {
      margin-right: 0; }
    .chartHolder .chartgroup:nth-child(4n) {
      margin-right: 0; }
    .chartHolder .chartgroup:nth-child(4n+1) {
      clear: left; }
    .chartHolder .chartgroup .subchart a img {
      max-height: 81px; } 
    
    .chartwrap .row .subchart a img {
      max-height: 81px; } 
}

@media screen and (max-width: 719px) {
  .chartHolder .chartgroup {
    float: left;
    display: block;
    margin-right: 2.35765%;
    /*width: 100%;*/
    margin-right: 0; }
    .chartHolder .chartgroup:last-child {
      margin-right: 0; } 
    #asideButtons {margin-top:20px;}

    .percent {
      white-space: normal;
    }
  }

  .chartHolder .chartgroup .subchart {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 48.82117%; }
  .chartHolder .chartgroup .subchart:last-child {
    margin-right: 0; }
  .chartHolder .chartgroup .subchart a img {
    float: left;
    display: block;
    margin-right: 2.35765%;
    /*width: 100%;*/
  }
  .chartHolder .chartgroup .subchart a img:last-child {
    margin-right: 0; }

@media screen and (max-width: 960px) {
  .chartIndex {
    float: left;
    display: block;
    margin-right: 2.35765%;
    width: 6.17215%;
    margin-right: 0; }
    .chartIndex:last-child {
      margin-right: 0; } 
}

.ui-tabs-anchor {
  width: 100% !important; }

.browsehappy {
  background: #EEEEEE;
  padding: 1em; }

  #splash {margin-top:10px;}
  #splashimage {width:100%;}
  #settings {display:none; margin-top: 1rem;}
  #chart, #map {margin-top:15px; margin-bottom: 2rem;}
  #forSlider, #forSlider input {font-weight:bold; width: auto !important; display:inline-block !important; margin-bottom: 0.3rem;}
  #forSlider input, #percentChange input {border:0;cursor:default;outline: none; }
  #mapbutton {display:none;}
  #percentChange .percent {display:block;}
  .forscreenreader{
    position:absolute;
    left:-10000px;
    top:auto;
    width:1px;
    height:1px;
    overflow:hidden;
  }
  .hidden{display:none;}

blockquote {
  background: transparent !important;
  padding: 0em 0.75em 0.5em 0.75em;
  border-left: 8px solid #f1f1f1;
  line-height:1.2;
}

label {
  z-index: 1 !important; 
  font-weight:bold !important;
}

select {
    width: 100%;
    padding: .375rem;
    line-height: 1.5;
    border: 1px solid #ced4da;
    border-radius: .25rem;
}

#selections .col.size-1of5{
  border-radius: 4px;
}

#percentChange {
  margin-bottom:15px;
}

#percentChange .amountTitle, #percentChange #amountAside, #percentChange #amountSingle  {
  display: none;
}

#percentChange .amountTitle {
  font-weight: bold; 
}

#percentChange #amountAside, #percentChange #amountSingle {
    margin: 0.25em auto;
    font-weight: bold; 
}

#percentChange #amountAside {
  border:0;
}

#percentChange .n1 {
  color: #e41a1c; }
  #percentChange .n2 {
  color: #377eb8; }
  #percentChange .n3 {
  color: #984ea3; }
  #percentChange .n4 {
  color: #4daf4a; }
  #percentChange .n5 {
  color: #ff7f00; }
  #percentChange .n6 {
  color: #C0C020; }
  #percentChange .n7 {
  color: #a65628; }
  #percentChange .n8 {
  color: #f781bf; }
  #percentChange .n9 {
  color: #999999; }
  #percentChange .n10 { 
  color: #000080; }
  #percentChange .n11 {  
  color: #6DD4BF; }
  #percentChange .n12 {  
  color: #00e04e;  }
  #percentChange .n13 {  
  color: #186571; }

  #percentChange .helptext {
  display: none;
  margin-top: 2em;
  margin-left: -1em; 
}

a.export {
  background-color: #0071bc;
    border: 0;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-weight: bold;
    line-height: 1;
    margin: 0 0 1.5em;
    padding: 0.5882em 1.1765em;
    text-align: center;
    text-decoration: none;
    vertical-align: baseline;
    white-space: normal;
    border-radius: 3px;
}

a.export:hover {
  background-color: #205493;
  box-shadow: none;
  outline: 0;
}

ul.relatedlinks {
  padding-left:10px;
}

ul.relatedlinks li {
  list-style: none; 
  float: left;
}
ul.relatedlinks li:before {
  content: ' \2022 ';
  padding-right: 0.5em;
  padding-left: 0.5em;
}

@media screen and (max-width: 805px) {
  #selections > .col {
    width:100%;
  } 
  ul.relatedlinks li {
    list-style: disc; 
    float: none;
  }
  ul.relatedlinks li:before {
    content: '';
    padding-right: 0;
    padding-left: 0;
  }
}
  .no-close.ui-widget-content, .no-close .ui-dialog-buttonpane{border: 0;}
  .no-close .ui-widget-header{border-color: #eee; background: #fafafa;}
  .ui-widget-header {background: #fafafa;}
  .no-close .ui-dialog-titlebar-close{display: none;}
  .no-close.ui-dialog .ui-dialog-buttonpane{margin-top: 0; padding-top: 0;}
  .no-close.ui-dialog .ui-dialog-content{padding-bottom: 0;}
  .no-close.ui-dialog p{padding-bottom: 0;}
  .ui-tabs-vertical { width: 100%; border:0 !important; }
  .ui-tabs-vertical .ui-tabs-nav { padding: .2em .1em .2em .2em; float: left; width:30%;}
  .ui-tabs-vertical .ui-tabs-nav li { clear: left; width: 100%; border-bottom-width: 1px !important; border-right-width: 0 !important; margin: 0 -1px .2em 0}
  .ui-tabs-vertical .ui-tabs-nav li a { display:block;}
  .ui-tabs-nav li a:hover, .ui-tabs-nav li a:focus{background-color: rgba(0,0,0,0) !important;}
  .ui-tabs-vertical .ui-tabs-nav li.ui-tabs-active { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; border-right-width: 1px; }
  .ui-tabs-vertical .ui-tabs-panel { padding: 0 3em 0 3em; float: right; width: 70%;}
  .smalltext{font-size: 0.8em;}
  .highcharts-axis, .highcharts-axis span {z-index: 1 !important;}
  .highcharts-tooltip, .highcharts-tooltip span{z-index:9999 !important;}
  #safarinote {cursor:pointer;}
  blockquote small ul { padding-bottom: 0;}
  blockquote small ul li { margin-top: 0.25rem;}

  @media screen and (max-width: 1200px) {
    .ui-tabs-vertical .ui-tabs-nav { padding: .2em .1em .2em .2em; float: none; width:100%;}
    .ui-tabs-vertical .ui-tabs-panel { clear:both;width: 100%;padding: 1em 0 1em 0;}
  }
  @media screen and (max-width: 320px) {
    .ui-tabs .ui-tabs-nav .ui-tabs-anchor {font-size: 11px;}
  }

  
/*2021 new styles for addition of state map feature in developement*/
p#statelink a {font-size: 1.125rem !important;}
/*
#tabs {
  overflow: hidden;
  background-color: #f1f1f1;
}
#tabs > button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
  font-size: 17px;
  color: #212121 !important;
  margin: 0;
}
#tabs > button:hover {
  background-color: #ddd !important;
}
#tabcontent > div:first-child {
  display: none;
}*/