@font-face {
    font-family: 'LA Web Display Kis Bold';
    src: url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.3.1/laheadline.eot');
    src: url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.3.1/laheadline.eot?#iefix') format('embedded-opentype'),
         url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.3.1/laheadline.woff') format('woff'),
         url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.3.1/laheadline.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Belizio Narrow Bold';
    src: url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.3.1/belizio-narrow-bold.eot');
    src: url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.3.1/belizio-narrow-bold.eot?#iefix') format('embedded-opentype'),
         url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.3.1/belizio-narrow-bold.woff') format('woff'),
         url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.3.1/belizio-narrow-bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Belizio Narrow SemiBold';
    src: url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.3.1/belizio-narrow-semibold.eot');
    src: url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.3.1/belizio-narrow-semibold.eot?#iefix') format('embedded-opentype'),
         url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.3.1/belizio-narrow-semibold.woff') format('woff'),
         url('https://s3.amazonaws.com/latimes-datadesk-template/fonts/0.3.1/belizio-narrow-semibold.ttf') format('truetype');
    font-weight:normal;
    font-style:normal;
	
}

  html, body {
    width:100%;
    height: 100%;
    margin: 0px;
  }

  h2 {
    font-family: 'Belizio Narrow SemiBold (Minified)', 'Belizio Narrow SemiBold', Georgia, serif;
    font-size: 32px;
    line-height: 32px;
    font-weight: normal;
    color: #000000;
    margin: 5px 0;
  }

  .cell {
      stroke: none;
      fill: none;
      pointer-events: fill;
  }

  .graphicHead {
	font-family:"LA Web Display Kis Bold";
	font-size: 20px !important;
	padding-left:10px;
	margin:0 0 10px 0;
	padding-right:20px;
	font-weight: normal !important;
	
  }
  
  .graphicLeadin {
    font-size: 14px !important;
	padding-left:10px;
	padding-right:20px;
	margin:0 0 5px 0;
  }
  
  .graphicLegend {
	  font-family:Arial, sans-serif;
    font-size: 12px !important;
	padding-left:10px;
  }

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

  .axis path,
  .axis line {
    fill: none;
    stroke: #B2B2B2;
    shape-rendering: crispEdges;
	
  }
  .axis.highlight {
    fill: none;
    stroke: #B2B2B2;
    shape-rendering: crispEdges;
	
  }
  
  .axis.textHighlight {
    font: bold 10px sans-serif;
	fill:#A75217;
  }
  
  .tick.major {
  	fill: #8B8B8B;
  }

  .circle1 {
    fill: gray;
	fill-opacity:1;
	pointer-events:none
  }
  
  .circle2 {
    fill: #BC2A00;
	fill-opacity:1;
	pointer-events:none
  }
  

  .line
  {
    stroke: #1755BC;
	stroke-width:3px;
    fill: none;
	stroke-linejoin:round;
  }
  
  .legendLine1{
  	color:#1755BC;font-family: "Belizio Narrow Bold", "Arial Black", sans-serif; font-size:16px;
	pointer-events:none
  }
  
  
  .line2
  {
    stroke: #BC4D00;
	stroke-width:3px;
    fill: none;
	stroke-linejoin:round;
  }
  
  .legendLine2{
  	color:#BC4D00;font-family: "Belizio Narrow Bold", "Arial Black", sans-serif;font-size:16px;
  }
  
  /* responsive map legend */
  
  #legend {
     font: normal 13px arial,sans-serif; 
     line-height:26px;
     margin-bottom:5px;
	}
	 #legend_label {
	     font: bold 15px arial,sans-serif;
	     padding:6px 0px;
	     margin-right:10px;
	 }
	 .keys {
	     display:inline;
	     margin-right:10px;
	 }
	 .keys img {
	     vertical-align:middle;
	     display:inline;
	     position:relative;
	     bottom:2px;
	 }   
     /* end responsive map legend */
  
  .tipDataLable{
	  font-family:Arial, sans-serif;
	  font-weight: normal;
	  font-size:9px;
	  line-height:10px;
	  text-transform:uppercase;
	  margin-bottom:0;
	  margin-top:2px;
  }
  
  .tipData{
	  font-family:Arial, sans-serif;
	  font-weight: bold !important;
	  font-size:14px !important;
	  line-height:16px !important;
	  margin-bottom:4px;
	  margin-top:2px;
	  overflow: visible;
  }
  
  .tipData.y1{ 

}
  .tipData.y2{ 
  }
  .tipData.y1s{
}
  .tipData.y2s{
}
  
  .tipnote{
	  font-family:Arial, sans-serif;
	  font-size:9px;
	  line-height:10px;
	  font-weight: normal;
	  margin-bottom:2px;
	  margin-top:2px;
	  color: gray;
	  fill: gray;
	  overflow: visible;
  }
  
  .tipnote.s{ }
  
  .legendLine1{
  	color:#1755BC;
	font-weight:bold;
	font-size: 14px;
	font-family:Arial, sans-serif;
  }
  
  .legendData1{
	  font-weight:bold;
	  visibility:visible;
	  font-family:Arial, sans-serif !important;
	  
  }
  
  .legendData2{
  	  font-weight:bold;
  	  visibility:visible;
	  font-family:Arial, sans-serif !important;
    }
	
  #chartContainer
  {
    overflow: visible;
    width:100%;
	font-size: 10px;
  }
  
  
  #chartSvg {pointer-events:none}

  .graphicNote{
	font-size: 10px !important;
	margin:0 0 5px 0 !important;
	padding-left:10px;
	padding-right:20px;
	font-family:Arial, sans-serif;

  }

  .graphicSource{
	font-size: 10px ;
	float:left;
	margin:0 0 5px 0 !important;
	padding-left:10px;
	padding-right:20px;
	font-family:Arial, sans-serif;
  }

  .graphicCredit{
	font-size: 10px !important;
	float:right;
	margin:0 0 5px 0 !important;
	padding-right:20px;
	font-family:Arial, sans-serif;
  }
  
  #tooltipdiv {
	  font-family:Arial, sans-serif;
	  position: absolute;
	  z-index: 10;
/*	  visibility: hidden;*/
	  opacity:0;
	  background: white;
	  padding: 5px;
	  border-style:solid;
	  border-width:1px;
	  border-color:#D4D4D4;
	  
	  
		
		
	  box-shadow: 2px 2px 2px rgba(64,64,64,0.3);
	  -moz-box-shadow: 2px 2px 2px rgba(64,64,64,0.3);
	  -webkit-box-shadow: 2px 2px 2px rgba(64,64,64,0.3);
	  border-radius: 2px;
	  -moz-border-radius: 2px;
  }
  
  .barContainer{
    fill: #8C8C8C;
	font-size:12px;
  }
  .bar{
    fill: #C2C0BB;
	vertical-align:middle;
	font-family:Arial, sans-serif;
  }  
  
  .bar.dataLabel{
    opacity:0;
  }
  
  .label.highlight {
	font-family:Arial, sans-serif;
    fill: #000;
	font-weight:bold;
  }
 
  .dataName{
	font-family:Arial, sans-serif;
    opacity:.8;
	fill: #666561;
  }
  .bar.negative {
    fill: #A72427;
  }
  .bar.highest {
    fill: #A75217;
  }
  .bar.highlight {
    fill: #BD4E16;
	font-weight:bold;
  }
 
  .bar:hover, .bar:hover+.bar.dataLabel{ 
    fill: #666561;
	font-weight:bold;
	opacity:1;
	display:block;
	opacity:1;
  }
  .overlay {
    fill: none;
    pointer-events: all;
  }
  
  /* Responsive styling */
  
  .grfx_source {
  		display: block;
  		font-family: Arial,serif !important;
  		font-size: 12px !important;
  		line-height: 16px !important;
  		color: #999 !important;
  	}
          .grfx_credit {
  		float:right;
  	}
	
  	.graphic_container{
  		width:100%;
  		clear: both;
  	}
  	.graphic_2x{
  		width:47%;
  		padding-right:3%;
  		float:left;
  	}
  	.graphic_2x3{
  		width:47%;
  		padding-right:3%;
  		float:left;
  	}
  	.graphic_3x{
  		width:31%;
  		padding-right:3%;
  		float:left;
  	}
  	.graphic_4x{
  		width:22%;
  		padding-right:3%;
  		float:left;
  	}
	
  	.graphic_5x{
  		width:17%;
  		padding-right:3%;
  		float:left;
  	}
	
	.mapiframe { width:100%; }

  #stepper_content{
    max-width:720px;
  }

 #step_nav {
    margin: 10px 0 20px;
    width: 100%;
  }

  .image_swap_item {
    display: none;
  }



  .btn-group {
    position: relative;
    display: inline-block;
    font-size: 0;
    white-space: nowrap;
    vertical-align: middle;
    margin-left: 10px;
  }

  button {
    margin: 0;
  }

  .btn {
    display: inline-block;
    padding: 4px 12px;
    margin-bottom: 0;
    font-size: 14px;
    line-height: 20px;
    color: #333;
    text-align: center;
    text-shadow: 0 1px 1px rgba(255,255,255,0.75);
    vertical-align: middle;
    cursor: pointer;
    background-color: #f5f5f5;
    background-image: -moz-linear-gradient(top,#fff,#e6e6e6);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#fff),to(#e6e6e6));
    background-image: -webkit-linear-gradient(top,#fff,#e6e6e6);
    background-image: -o-linear-gradient(top,#fff,#e6e6e6);
    background-image: linear-gradient(to bottom,#fff,#e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #ccc;
    border-color: #e6e6e6 #e6e6e6 #bfbfbf;
    border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
    border-bottom-color: #b3b3b3;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff',endColorstr='#ffe6e6e6',GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
    -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
  }

  .btn-group>.btn:first-child {
    margin-left: 0;
    -webkit-border-bottom-left-radius: 4px;
    border-bottom-left-radius: 4px;
    -webkit-border-top-left-radius: 4px;
    border-top-left-radius: 4px;
    -moz-border-radius-bottomleft: 4px;
    -moz-border-radius-topleft: 4px;
  }
  .btn-group>.btn, .btn-group>.dropdown-menu, .btn-group>.popover {
    font-size: 14px;
  }



  .btn-group>.btn {
    position: relative;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
  }

  .btn-group .btn {
    background-color:#fff; 
    background-image:none;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 2px 5px rgba(0,0,0,0.4);
    font-weight: bold;
  }
  .btn-group .btn:hover {background-color:#efefef;}    



  	
      @media (max-width: 480px) {
  		.graphic_2x {width:100%;padding-right:0;}
		.graphic_2x3 {width:100%;padding-right:0;}
          .graphic_3x {width:100%;padding-right:0;}
  		.graphic_4x {width:100%;padding-right:0;}
  		.graphic_5x {width:100%;padding-right:0;}
		.mapiframe{height:300px;}
		
      }
  	@media (min-width: 481px) {
          .graphic_2x {width:100%;padding-right:0;}
		  .graphic_2x3 {width:47%;padding-right:0;}
  		.graphic_3x {width:100%;padding-right:3%;} 
  		.graphic_4x {width:22%;padding-right:3%;}
  		.graphic_5x {width:47%;padding-right:3%;}   
		.mapiframe{height:500px;}  
      }
      @media (min-width: 767px) {
		  .graphic_2x3 {width:47%;padding-right:0;}
          .graphic_2x {width:47%;padding-right:3%;}
          .graphic_3x {width:30%;padding-right:3%;} 
  .graphic_5x {width:17%;padding-right:3%;}  
      }

      @media (min-width: 980px) {
          /*#pos1x2 {height:250px;}
  		#pos2x2 {height:250px;}*/
      }

      @media (min-width: 1200px) {
         /* #pos1x2 {height:250px;}
  		#pos2x2 {height:250px;}*/
      }
	  /* end responsive styling *?