/* css for state charts */

/*.st1,  only for 2015 chart*/
.AK {
	fill: #BE6073;
	fill-opacity:0.8;

}
.st2, .FL {
	fill: #E8E8E8;
	fill-opacity:0.8;

}


.st2, .KS {
	fill: #E8E8E8;
	fill-opacity:0.8;

}

.st3, .AZ {
	fill: #BFA07B;
	fill-opacity:0.8;

}
.st4, .CA {
	fill: #409177;
	fill-opacity:0.8;

}

.st6, .ID {
	fill: #81BF7B;
	fill-opacity:0.8;

}
.st7, .MT {
	fill: #7BACBF;
	fill-opacity:0.8;

}

.st8, .NM {
	fill: #7BACBF;
	fill-opacity:0.8;

}
.st9, .NV {
	fill: #7B88BF;
	fill-opacity:0.8;

}

.st10, .CO {
	fill: #98C3CC;
	fill-opacity:0.8;

}

.st11, .OR, .OR2 {
	fill: #947BBF;
	fill-opacity:0.8;

}
.st12, .Other {
	fill: #B3B3B3;
	fill-opacity:0.8;

}
.st13, .TX {
	fill: #6170AC;
	fill-opacity:0.8;

}
.st14, .UT {
	fill: #D4ABCF;
	fill-opacity:0.8;

}
.st15, .WA {
	fill: #BF7BA0;
	fill-opacity:0.8;

}
 .WY {
	fill: #c36a67;
	fill-opacity:0.8;

}
.West, .US {
	fill: #B3B3B3;
	fill-opacity:0.8;

}



@media screen and (min-width: 1201px){
	#map-info-box-items-wrapper-full {
	height: 39%;
	/* 
	override 29% value in default styles
	since took out legend from floaters
	*/
	} 
}

/* Taken from wildfires-150126-01.css */

	/* legend layer taken out of floating panels */
	/* lives in wildfires-top-and-main */
	#legendFloat {
		z-index: 9002;
		left:2%;
		top:65% !important;
		width:200px;
		min-height:60px;
		position:absolute;
		background:red !important;
		border:0px none !important;

	}
	#legendFloat .inner {
		/* background:purple !important; */
		margin-top:5px;
	
	}


	#acresTooltip{
	z-index: 33000;
    width: 260px;
    max-height: 219px;
    padding: 14px;
    font-size: 9pt;
    line-height: 1.2;
    /* color: #666; */
    position: absolute;
    display: block;
    /* background-color: white; */
    overflow-y: scroll;
    font-size: 0.8em;
    background-color: #F5F5C8;
    font-family: 'Mako', sans-serif;
    border: 1px solid #D6D696;
    padding: 9px;
}	

#acresInfoIcon {
	border: 1px solid #A9A9A9;
    border-radius: 100px;
    width: 15px;
    height: 15px;
    margin-top: 0px;
    padding-left: 4px;
    margin-left: 3px;
    font-size: 11px;
    font-weight: bold;
    font-family: "Bitter",serif !important;
    margin-top: 1px;
    /* float: right; */
    display: inline-block;

}

	/* for making date display flush left  */
	.moveLeft {
		left: 200px !important;
	}


	.markerContent {
		max-width:200px;
	
	}
	
	.inner a {
		padding:0px;
		font-size:90%;
	}
	
   		#dropdownWrapper{
			display:none;
		}

		
	/* put these into map-layer-buttons.less on 150611 */
	.map-layer-button {
		background-image: -webkit-linear-gradient(bottom, #efefef, #f7f7f7);
		height:24px;
		border: 1px solid #ccc;
		margin: 3px;
		color:#666;
	}
	
	.map-layer-button-round {
		  background-image: -webkit-linear-gradient(bottom, #EFEFEF, #FFFFFF);
		  height: 24px;
		  border: 1px solid #A09999;
		  margin: 3px;
		  color: #ABABAB;
		  width: 23px;
		  border-radius: 50px;
		  padding-top: -4px;
		  font-weight: bold;
		  margin-top: 2px;
		  baseline-shift: super;
		  font-size: 1em;
		  padding-bottom: 16px;
  }
	
	.map-temporal-left-button {
		background:none;
		margin-left:8px;
		height:24px !important;
	}
	.map-temporal-right-button {
		background:none;
		margin-right:8px;
		height:24px !important;
	}
	
	
	/* gm add 150612 - wasn't calculating height of map without this */
	#fireArea {  
		height: 100%;
		background-color: #121212;/*  added for frame around area map 150721 */
	}

	/* end these into map-layer-buttons.less on 150611 */

	/* redefine ui-slider */
	
	
	
	#sliderWrapper {
		z-index: 12000;display: block; position: absolute; margin: 10px auto;margin-top:-2px;width:90%;left:5%;font-size:13px;font-family:'Bitter';s!ismportant;
	
	}
	
	#allSlider {
		min-width:450px;
	}
	
	.horizontal .ui-slider-labels {
		left: 0px;
		right: 0px;
		top: 4px;
	}

	.ui-widget-content {
		height: 7px;
		border-top: 2px solid rgb(204, 204, 204);
		background-color: rgb(218, 218, 218);
		margin-top: 6px;
	}
	
	.ui-widget {
    	font-family: Mako,Verdana,Arial,sans-serif;
    	font-size: 14px;
	}

	.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
		background: url(./img/slider-wildfires-v4-72px.svg) 50% 0% repeat-x;
	  font-weight: normal;
	  color: #555;
	  top: -7px;
	}


	/* redefine stock ui elements */
	#pop_GroupDiv {
	
		overflow:visible !important;
	}
	#pop {
	
		overflow:visible !important;
	}


    .mapDetails {
			font-family: 'Mako','Helvetica Neue',sans-serif;
			line-height:1.4;
    }

		.fireZoomButton {
			width: 75px;
			height: 55px;
			background-color: #030303;
			right: -50px;
			position: absolute;
			top: 80px;
			color: rgb(255, 255, 255);
			padding: 9px;
			font-size: 13px;
			font-family: Mako;
			  -webkit-border-radius: 5px;
			  -moz-border-radius: 5px;
			  border-radius: 5px;
		}
		

		.firename {
			font-family: 'Mako','Bitter',sans-serif;
			font-size: 13pt;
			text-overflow:ellipsis;
			max-width:250px;
			margin-bottom:7px;
		}
    
    	.mapDetails p{
			margin:0
			font-family:sans-serif;
			font-size:13px;
			line-height:18px;
	}
		.mapDetails a, .fireZoomButton a{
			font-weight:normal;
			padding:0;
		}
		
		 .fireZoomButton a{
		 	color: white;
		 }
		
		/* added for complexes 150919 */
		#firesContainedInfo {
			padding: 10px;
			background-color: rgba(238, 238, 238, 0.44);
			border-radius: 5px;
   			margin-left: -4px;
   			margin-bottom:5px;
		}
		
		.lightOnDark, .lightOnDark a {		
			color: #fff;
		}
		/* .darkOnLight, .darkOnLight a { */
		.darkOnLight { /* so links are visible in tooltips 150919 */
			color: #333;
		}
		
		#dateDisplay {
				
			/* font-size:1em; */
			font-size:13px; /* 150721 */
			font-family:'Mako',sans-serif;
			top: 75px;
			text-align:center;
			color:#fff;
			/* background-color:#333; */
			z-index:12000;
			padding:7px;
			padding:5px;
			spadding-left:10px;
			spadding-right:10px;
			/* border:1px solid #000; */
			/* width:325px; */ /* fixed width for these 150616 gm */
			width:250px; /* fixed width for these 150616 gm */
			/* margin-left:25px; */
				
		}
		
		/* moved to additions.less */
		/* .mapTitleCenter { 
			  position: absolute;
			  stop: 60%; 
			  left: 50%;
			  transform: translate(-50%, 0px);
		}*/
	
	
    #tableContainer th {
    	text-align:left;
    }
	
	#fireDetailTable {
		width:100%;
		border:0;
		/* padding:10px; */
		padding:5px; /* gm 150617 */
		
	
	}
	
	#fireDetailTable td {
		/* color: red; */
		/* vertical-align:top; */
	} 
	
	.valueLabel {
		font-family:'Mako',sans-serif;
		min-width:100px;
		text-transform: uppercase;
		font-size: 7pt;
		letter-spacing: 0.5px;
		line-height:1;
		margin-bottom: -3px;
		opacity:0.7;
	}
	.valueCell  {
		font-family:'Mako',sans-serif;
		font-size:1.1em;
		color: black;
		width:60%;
	}
	#pop_contentDiv a{
		padding:0px;
	}
	
    /* 
    
    
#firesList, .fires_list {
		font-family: 'Mako',sans-serif;
		font-size:0.8em;
		text-align:left;
    	z-index:9999;
    	display:block;
    	color:red;
    	position:absolute;
    	left:60%;
    	top:20%;
    	width:39%;
    	height:80%;
    	background:#fff;
    	padding:2%;
    	overflow:scroll;
    	border-left:1px solid #666;
    	border-top:1px solid #666;
    	border-bottom:1px solid #666;
    	
    	
    }
 */
 
 .fires_list, #fires_list .fireRow {
 
		 
		 text-overflow:ellipsis;
		 overflow:hidden;

}

.svgHighlight {
	/* fill: yellow !important; */
	stroke: black;
	stroke-width:2;
	/* opacity:1; */
}
.svgOn {
	opacity:1;
}

.svgFade {
	opacity:0.2;
}

#labels_new text {
	pointer-events:none;
}

.fireRow {
	font-size:13px;
}

.fireRow.odd {
background: #efefef;
}

			#fireMap {
				background:#333;
				position:absolute;
				left:0px;
				top:0px;
				/* width:100%; */
				height:93%; /* changed to raise scale bar */
				height:100%; /* changed again 150616 gm */
				
				/* changes 150721 to make frame */
				  position: absolute;
				  left: 0px;
				  top: 0px;
				  /* width: 98%; */
				  /* height: 93%; */
				  /* height: 100%; */
				  height: 98.5%;
				  margin: 5px !important;
				  right: 0px;
				
				
			
			}
			
			#fireMapInfo {  
				z-index: 1000;
			  margin-top: 15px;
			  background-color: #333;
			  border: 1px solid black;
			}
			
			#areaSliderWrapper {
				/* color:#efefef;
				text-shadow:none;
				float:left;
				width:40%;
				max-width:450px;
				margin:right:10px;
 */
 			   z-index: 999;
			  /* background-color: #333; */
			  padding-left: 40px;
			  padding-right: 40px;
			  /* have to be off center for play button to appear */
			  padding-left: 70px;
			  color: #efefef;
			  text-shadow: none;
			  float: left;
			  /*height: 120px;*/
			  padding-top: 0px;
			  margin-top: -10px;
			 /* 
 width: 40%;
			  min-width:250px;
			  max-width: 450px;
			  
 */			width:325px; /* fixed width for these 150616 gm */
 			width: 250px; /* 150721 */
			}
		   #areaSlider {
   				background-image: url('./img/gradient-yor-desat-12.jpg');  	
   				background-size: cover;
   				z-index:91000;
   				swidth:60%;
   				smax-width:400px;
				margin-top:15px;
				width: 100%; 
				/* width: 75%;*/ /* gm change to make room for play button 150616 */
				color:#efefef;
				text-shadow:none;
				font-size:11px;
				font-family:'Helvetica Neue',Arial, sans-serif !important;
				font-weight:100;
   		}
			#areaSliderVert {
   				z-index:91001;
   				swidth:20px;
   				smax-width:400px;
				margin-top:15px;
				float:right;
				height:60px;
				smargin-right:10%;
				display:none;
   		}
   		#the_controls {
				/* 
z-index:13000;
				margin-top:5px;
				margin-bottom:5px;
				margin-left:20px;
				display:inline;
				float:left;
				margin-right:20px;
				
				
 				*/
				z-index: 13000;
				  /* top: 95px; */
				  margin-top: -3px; /* gm add 150624 */
				  /* margin-bottom: 5px; */
				  margin-bottom: 12px;/* gm add 150624 */
				  margin-left: 20px;
				  margin-right: 20px;
				  position: relative;
				  float:left;
				  /* 
transform: translate(-50%,0);
				  left: 37%;
 */
 
   		}
   		.controlImg {
   			/* 
width: 40px;
   			height: 32px;
 */
   			  width: 30px;
  			height: 27px;
   			padding:5px;
   			margin-top:5px;
   			background:#666;
			  -webkit-border-radius: 3px;
			  -moz-border-radius: 3px;
			  border-radius: 3px;
   			
   		}
   		.controlImg a:hover {
   			border: 1px solid #ccc;
   		}
   		
   		.controlBackToMap {
   			display:none; /* temp disable */
   			/* float:right; */
   			/* padding-right:25px; */
   			/* margin-top:-8px; */
   			
   			/* changes 150721 to make frame */
   			  display: block;
			  /* float: right; */
			  
			  margin-top: 0px;
			  position: absolute;
			  left: 100%;
			  top: 0px;
			  /* width: 142px; */
			  min-width: 110px; /* changed for mobile 150919 */
			  height: 28px;
			  background-color: #333;
			  z-index: 2;
			  transform: translate(-100%,0);
			  -webkit-transform: translate(-100%,0);
			  text-align: center;
   		}
   		.controlImgBack {
   			display:none; /* temp disable */
   			width:30px;
   			height:30px;
   			float:right;
   		}
   		
   		.controlSwitchLayer{
   			left:0% !important;
   			transform: translate(0,0);
			  -webkit-transform: translate(0,0);
			/* override controlBackToMap bg */
		    background: none;
   		}
   		.controlBackText {
   			text-transform:uppercase;
   			color:#efefef;
   			font-size:10px;
   			/* float:right;
   			line-height:1.5;
   			text-align:right;
   			padding-right:7px; */
   			/* for frame 150721 */
   			font-family:'mako',"Helvetica Neue", sans-serif;
   		}
   		
   		/* taken from drought 160803 - add to general css?*/
   		#backToNow {
			position: absolute;
			/*top: 46px;*/ /*calculated programattically based on other elements*/
			z-index: 1000; /* to be on top of slider handle */
			background-color: rgb(204, 204, 204);
			/* width: 78px; */
			/* height: 24px; */
			/* left: -1px; */
			padding: 3px;
    		padding-left: 5px;
			font-size: 0.6em;
			color: #3E3E3E;
			text-align: center;
			font-family: Mako, sans-serif;
			border: 1px solid #666;
			left: 50%;
			text-transform: uppercase;
			letter-spacing: 0.5px;
			
			
		}
   		/* image mode switcher 150812 on precip, 160804 on wildfires*/

		 ul.modeSwitcher {
			margin-top: 7px;
			margin-left: 7px;
		}

		.modeSwitcher li {
			display: inline-block;
			padding: 3px;
			border: 1px solid black;
			max-height: 21px;
			font-size: 10px;
			padding-left: 8px;
			padding-right: 7px;
			text-transform: uppercase;
			font-family:Mako, sans-serif;
			background:#ccc;
			color:#666;
			cursor:pointer;
		}


		.modeSwitcher li.on {
			color: #1f1f1f;
    		background-color: #fff;
		}

		.modeSwitcher li:hover {
			color: #fff;
			background-color:#666;
		}

		.modeSwitcher li:first-child {
			border-radius: 5px 0px 0px 5px;
			border-right:0px none white;
		}

		.modeSwitcher li:last-child {
			border-radius: 0px 5px 5px 0px;
			border-left:0px none white;
		}
   		
   		
   		/* moved this to additions.less 150626 gm*/
   		/*#locatorMap {
			
			position: absolute;
			left: 0px;
			bottom: 0px;
			width: 250px;
			height: 270px;
			padding-top:25px;
			z-index: 1000;
			z-index: 100000;
			pointer-events:none;
			
		}	
		
		#theLocatorMap path{
			 stroke:black;
			 stroke-width:0.5px;
			 fill:#EDEBE1;
			 pointer-events:auto;
			
		}*/
   		
   		/* google maps reset to alter scalebar */ 
   		.gm-style {
   			/* 
font-family:'Bitter','Mako',sans-serif;
   			font-size: 13pt;
 */
 /* instead overriding in modified openlayers scalebar css */
   		}
   		
@media only screen and (max-width: 800px) {
	
	/* 6/17/2016 adjustments to make embedded fire work better */
	
	#locatorMap {
		/* background-color: rgba(0, 0, 0, 0.09); */
		position: absolute;
		left: 0px;
		bottom: 0px;
		width: 200px;
		height: 210px;
		padding-top: 25px;
		z-index: 100000;
		pointer-events: none;
	}
	
	
	#map-info-box-items-wrapper-small {
		height:33%;
		min-height:150px;
	}
	 #map-info-box-items-wrapper-small.fireAreaMode {
		min-width:40% !important;
		width:44% !important;
	}

	  #map-info-box-items-wrapper-small .map-info-box-items .fireAreaMode{
		font-size: 0.7em;
		line-height:1.1;
	}

	#fireDetailTable{
		padding:0px;
		line-height: 1.1;
	}

	#fireDetailTable  .valueLabel {
		font-size:0.75em;
		min-width:0px;
	
	}
	#fireDetailTable .valueCell {
		font-size:0.9em;
		width:60%;
	}

	#fireMapInfo {
		margin-top:-1px;
		background-color: #212121;
	}

	#fireMap #dateDisplay {
		font-size:12px;
		overflow-y: hidden;
		height: 20px;
	}

	#the_controls {
		margin-bottom: 6px;


	}
   		
   		
}   		
   		
@media only screen and (max-width: 620px) {
   		.controlBackToMap {
   			display:none;
   		}


   		#map-temporal-layer-switchers {
   			width:250px; /*gm add for switch to dropdown menu 150625 */
   		}
   		
   		
   			#dropdownWrapper{
			display:block;
		}
 }
@media only screen and (max-width: 480px) {  	
		
		#locatorMap {
			/* background-color:#ffcc00; */ 
			transform: scale(0.65,0.65);
		}
		
		.olControlZoom {
			right:10px !important;
		}
	
		#dropdownWrapper{
			display:block;
		}

   		#map-layer-buttons {
   			display:none;
   		}
   		
		.map-temporal-layer-switcher-container {
		 	 /* width:100%; */
		}
		
		.map-temporal-layer-switcher-wrapper {
   			/* moved to responsive-480 */
   			/* visibility:hidden; */
			/* width:100%; */
		}
		
		.map-temporal-layer-switcher {
			
		}
		
		
		
		/* 
.ui-slider-wrapper{
			width: 80%;
		}
 */
		
		
		.ui-slider-label-ticks {
			font-size:9px;
		}
   		
   		
 } 
 
 #shell_footer a,.notesFluid a {
	color: #333;
	text-decoration: none;
	padding:0px;
}