@charset "utf-8";
/* CSS Document */

/*holds all of the slider elements and the button for the text box*/
.container{
border-color: #999999;
  border-width:3px;
  border-style: solid;
background-color:#dddddd;
height:72px;
width:241px;
top:-5px;
}
/*holds all of the slider elements and the button for the text box*/
#albedoContainer{
position:relative;



}
#greenhouseContainer{
position:relative;
top:-83px;

left:245px;
}

#distanceContainer{
position:relative;
top:-161px;

left:490px;
}

#tempContainer{
position:relative;
top:-239px;

left:735px;
}

/*holds the slider and its results*/
.panel{
position:relative;
left:30px;
background-color:#dddddd;
width:150px;


}
/*
#greenhousePanel{
position:absolute;

background-color:#dddddd;
width:240px;
height:40px;

}*/
/*the slider background*/
.slider {

top:5px;
width:200px;
height:9px;
background:url(../images/slider-bg.png);
position:relative;
margin:0;

}


/*Style for the slider button*/
.ui-slider-horizontal .ui-slider-handle {
width:14px;
height:22px;
position:absolute;
top:-6px;
margin-left:-12px;
z-index:200;
background:url(../images/slider-button2.png);
border: none;

}

/*Result div where the slider value is displayed*/
.slider-result {
font-size:14px;
height:0px;
font-family:Arial, Helvetica, sans-serif;
color:#112233;
width:200px;

text-align:right;
position:relative;
font-weight:100;
top:-18px;
}

/*what the slider is changings name*/
#slider-text {
font-size:14px;
height:0px;
font-family:Arial, Helvetica, sans-serif;
color:#112233;
width:400px;
text-align:left;

font-weight:50;
top:18px;
}
.borderClass{
  
  /** OR USE INLINE
  border: 1px solid #C1E0FF;
  **/
}

/*This is the fill bar colour
.ui-widget-header {
background:url(fill.png) no-repeat left;
height:8px;
left:1px;
top:1px;
position:absolute;
}
*/
a {
outline:thin;
-moz-outline-style:none;
}

/*the button that displays the text box*/
.numericButton {
	position:absolute;
	top:20px;
	left:2px;
	background-color:transparent;
	background-image:url(../images/changeData.gif);/*this address has to be changed slightly to accesss the icon*/
	border-color: #999999;
  border-width:2px;
  border-style: solid;
	-webkit-border-top-left-radius:0px;
	-moz-border-radius-topleft:0px;
	border-top-left-radius:0px;
	-webkit-border-top-right-radius:0px;
	-moz-border-radius-topright:0px;
	border-top-right-radius:0px;
	-webkit-border-bottom-right-radius:0px;
	-moz-border-radius-bottomright:0px;
	border-bottom-right-radius:0px;
	-webkit-border-bottom-left-radius:0px;
	-moz-border-radius-bottomleft:0px;
	border-bottom-left-radius:0px;
	text-indent:0;
	display:inline-block;
	color:#666666;
	font-family:Arial;
	font-size:16px;
	font-weight:bold;
	font-style:normal;
	height:16px;
	line-height:16px;
	width:17px;
	text-decoration:none;
	text-align:center;
}

/*changes the image on the button when it is hovered over*/
.numericButton:hover {
	position:absolute;
	top:20px;
	left:2px;
	background-color:transparent;
	background-image:url(../images/changeData.gif);/*this address has to be changed slightly to accesss the icon*/
	border-color: #999999;
  border-width:2px;
  border-style: solid;
	background-image:url(../images/changeData_over.gif);/*this address has to be changed slightly to accesss the icon*/
}

/*changes the position and dimensions of the text box*/
.textEntry{
	position:absolute;
	top:43px;
	left:90px;
	width: 8;
	
	font-family:Arial;
	font-size:14px;
	
	font-style:normal;
	height:16px;
	z-index:300;
	/*visibility:hidden;*/
}

.max
{
width:200px;
position:relative;
text-align:right;
top:20px;
}