/*demo page css*/
body{ font: 62.5% "Trebuchet MS", sans-serif; margin: 50px;}
#dialog_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
#dialog_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
ul#icons {margin: 0; padding: 0;}
ul#icons li {margin: 2px; position: relative; padding: 4px 0; cursor: pointer; float: left;  list-style: none;}
ul#icons span.ui-icon {float: left; margin: 0 4px;}

.left-side {
	position:absolute;
	top:110px;
	left:0px;
	WIDTH: 200px;
	background-color: white;
	
}
.right-site{
	position:absolute;
	top:7px;
	left:205px;
	
}
.tab-container{
	height:720px;
	background-color: white;
}
.zoom{
	cursor:zoom-in;
	
}

.imgbox {position:absolute;
	top:7px;
	left:0px;
}
.image_map{
	width:600px;
	
}

.legend0{
	position:absolute; 
	width:620px;
}
.legend1{
	position:absolute; 
	width:620px;
}

.hover {
	background:#E1D295;
}

.period_name{
	padding:5px;
	cursor:pointer;
	cursor:hand;
}

.question{
	cursor:pointer;
	cursor:hand;
}
.map_images{
	left: 210px;top:40px;width:80%;
	position: absolute;background-color: #FCFBF5;
	border:0px solid;
	border-color:#E4DBA5;
	border-radius:5px;
	-moz-border-radius:5px; /* Firefox 3.6 and earlier */
}

.myButton2
{
	-moz-box-shadow: inset -1px -1px 0px -1px #ffffff;
	-webkit-box-shadow: inset -1px -1px 0px -1px #ffffff;
	box-shadow: inset -1px -1px 0px -1px #ffffff;
	background: -moz-linear-gradient( center top, #badebe 5%, #F3AB9E 100% );
	background: -webkit-linear-gradient( center top, #badebe 5%, #F3AB9E 100% );
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F3AB9E', endColorstr='#F3AB9E');
	background-color:#F3AB9E;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-box-shadow: 0px 1px 3px rgba(000,000,000,0.5), inset 0px 0px 1px rgba(255,255,255,0.7);
	-webkit-box-shadow: 0px 1px 3px rgba(000,000,000,0.5), inset 0px 0px 1px rgba(255,255,255,0.7);
	display: inline-block;
	color: #555;
	font-family: arial;
	font-size: 11px;
	font-weight: bold;
	text-decoration: none;
	margin: 6px 5px 5px 0;
	cursor:pointer;
	cursor:hand;
}
.myButtonThree2
{
	float: left;
	text-decoration: none !important;
	padding: 4px 4px;
}
.myButtonThree2:hover
{
	background: -moz-linear-gradient( top, #badebe 0%, #94b598);
	background: -webkit-linear-gradient( top, #badebe 0%, #94b598);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#94b598', endColorstr='#badebe');
	background-color: #94b598;
	color: #000;
	text-decoration: none;
}
.myButtonThree2:active
{
	position: relative;
	top: 1px;
}

.title{
	position:absolute; 
	top:50px; 
	left: 25px;
	width: 720px;
	padding-bottom:50px;
	font-size: 1.5em;

}
.title_enso{
	font-size: 1.1em;
}
.title2{
	//background-color: red;
	position:absolute; 
	top:380px; 
	left: 25px;
	width: 720px;
	padding: 10px;
	font-size: 1.5em;
	//background-color: white;
	border-radius:5px;
	-moz-border-radius:5px;
	
	/* Firefox 3.6 and earlier */
}			
.title3{
	position:absolute; 
	top:35px; 
	left: 25px;
	width: 85%;
	padding: 10px;
	font-size: 1.5em;
	background-color: white;
	border-radius:5px;
	-moz-border-radius:5px; /* Firefox 3.6 and earlier */
}			

.map { 
	position: relative; 
	top: 0px;
	left: 0px;
	margin: auto; 
	width: 100%; 
	height: 500px;
}

.selected_location {
	position:absolute; 
	top:370px; 
	left:15px;
	font-size: 1em;
	font-weight:bold;
	color:blue;
}
.selected_locationSE {
	position:absolute; 
	top:140px; 
	left:110px;
	font-size: 1em;
	font-weight:bold;
	color:blue;
}		
.legend_box{
	width: 50px; 
	position:absolute; 
	top:100px; 
	left:10px;
	padding:3px;
	color:black;
	background-color:white;
	border:1px solid;
	border-color:#C9C9C9;
	border-radius:5px;
	font-size: 0.8em;
	-moz-border-radius:5px; /* Firefox 3.6 and earlier */
}
.map_title{
	position:absolute; 
	left:220px;
	top:60px;
	font: 20px sans-serif;
}
.browsing_maps{
	position:absolute; 
	top:500px; 
	left:25px;
	width:90%;
	padding:3px;
	font-size: 1em;
}
.browsing_mapsSE{
	position:absolute; 
	top:400px;  
	left:5px;
	width:50%;
	padding:3px;
	font-size: 1em;
}
.select_state{
	position:absolute; 
	top:80px;  
	left:85%;
	padding:3px;
	font-size: 1em;

}
.chart_box_enso{
	height:80px;
	padding:3px;
	color:black;
	border:1px solid;
	border-color:#DBDBDB;
	border-radius:5px;
	-moz-border-radius:5px; /* Firefox 3.6 and earlier */
}
.chart_box_months_all{
	height:80px;
	padding:3px;
	color:black;
	border:1px solid;
	border-color:#DBDBDB;
	border-radius:5px;
	-moz-border-radius:5px; /* Firefox 3.6 and earlier */
}
.chart_box_enso_title{
	font-weight:bold;
}
.chart_box_months_all_title{
	font-weight:bold;
}

.chart_box_enso_legend{
	font-size: 0.8em;
}

.list_years{
	//position:absolute; 
	//top:60px; 
	//right:10px;
	cursor:pointer;
	cursor:hand;
	font-size: 0.7em;
	color:black;
	//font-weight: bold;

}

.button_location{
	position:absolute; 
	top:650px; 
	left:10px;
	cursor:pointer;
	cursor:hand;
	font-size: 1.2em;
	color:black;
	font-weight: bold;
}
.button_location:hover {
	color: blue;
	
	}
.menu_box{
	position:absolute; 
	top:0px; 
	left:0px;
	padding:0px;
	color:black;
}
.jqplot-yaxis { margin-right: 5px; }

.loadingScreen{
	position:absolute; 
	top:250px;
	left: 350px;
}				

.move_right{
	position: relative; 
	left:100px;
	font-size: 1em;
}
.map_info{
	position:absolute; 
	bottom:5px;
	right:20px;
	font-size: 1em;
}

.mouse_roll{
	position:absolute; 
	top:80px;
	right:10px;
	font-size: 1em;
	font-weight:bold;
	color:blue;
	
}
.tab_maps{
	position:absolute; 
	top:85px;
	left: 20px;
	
}
.compare_maps{
	position: absolute; 
	top: 0px;
	left:60px;
	width: 700px; 
	height: 560px;
	
}

.map_compare {
	position: absolute; 
	width:322px;
}

.map_1{
	top:10px;
	right:0px;
}
.map_2{
	top:10px;
	left:50px;
	
}
.map_3{
	top:230px;
	right:0px;
	
}
.map_4{
	top:230px;
	left:50px;
}

.label_compare {
	position: absolute; 
	top:100px;
	left:10px;
	width:100%;
	//background:red;
}


.jqplot-target {
	position: relative;
	color: black;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1em;
}

.jqplot-axis {
	font-size: 0.8em;
}

.jqplot-xaxis {
	margin-top: 5px;
}

.jqplot-yaxis {
	margin-right: 5px;
}
.jqplot-xaxis-tick{
	font-size: 0.8em;
}

table.jqplot-cursor-tooltip {
	border: 1px solid #cccccc;
	font-size: 0.75em;
}

.jqplot-cursor-tooltip {
	border: 1px solid #cccccc;
	font-size: 0.75em;
	white-space: nowrap;
	background: rgba(0, 0, 0, 1);
	padding: 1px;
}
.jqplot-xaxis-tick {
	top: 0px;
	/* initial position untill tick is drawn in proper place */
	left: 15px;
	/*    padding-top: 10px;*/
	vertical-align: top;
}
.jqplot-xaxis-label {
	margin-top: 10px;
	font-size: 11pt;
	position: absolute;
}

#myHideFrame {
    position: absolute;
    top: -9999px;
    width: 1px;
    height: 1px;
}
.download_div{
	 position: absolute;
	 width:100px;
	 height:50px;
}
.download_divSE{
	 position: absolute;
	 width:100px;
	 height:50px;
}
.download_title{
	position: absolute;
	top: 20px;
	left: 35px;
	font-size: 3em;
	
}
.agroLogoUSA{
	position:absolute;
	top:610px;
	left:200px;

}
.image_map_downloadUSA{
	height:800px;
}
.image_map_downloadSE{
	height:1000px;
}
.download_legend{
	position:absolute;
	top:100px;
	right:50px;
	font-size: 1.5em;
	border: 1px solid #cccccc;
	padding: 1px;
	border-radius:5px;
	-moz-border-radius:5px; /* Firefox 3.6 and earlier */
}
#ex1{
	//padding-left: 30px;
}
.title_frequency{
	padding-bottom: 10px;
}
.img_div {
    position: absolute;
	top:0;
  
  }
  .img_div {
    position: absolute;
	top:300px;
  
  }
  
  .buttons{
	
	border: 1px solid #cccccc;
	padding: 1px;
	border-radius:5px;
	-moz-border-radius:5px; /* Firefox 3.6 and earlier */
	width: 105px;
	height:40px;
	cursor:pointer;
	cursor:hand;
	font-size: 0.8em;
	color:black;
	font-weight: bold;
	background-color:#EEEEEE;
}
.buttons:hover {
	color: blue;
	}

.links:hover{
	color: blue;
}	
.disabledinput {
  opacity: 0.4;
  filter: alpha(opacity=40); /* For IE8 and earlier */
}
.enabledinput {
  opacity: 1;
  filter: alpha(opacity=100); /* For IE8 and earlier */
}