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

#sidebar form{
	position: relative; /*will move down if menu gets bigger*/
	margin-left: 1.4em;
	font: 0.8em Arial, Helvetica, sans-serif;
	line-height: 1.2em;
	opacity: 1.0;
}

#compareRet a:link, #compareRet a:visited, #compareRet a:active {
    /*Turn off the blue color and undeline style*/
	color: #ffffff;
	text-decoration: none;
}
#compareRet a:hover{
	color: #ffdeca;
}

#rockImage{
	position: relative;
	z-index: 8
}

#rockImageBehind{
	position: relative;
	z-index: 7
}

#content.figurePage div.compare{  /*Compare image page with sidebar. Container for images.--*/
	width: 41.6em;
	height: 31.2em;  /*---4:3 aspect ratio standard---*/
	position: relative;
	margin-left: auto;
	margin-right: auto;
	font-family: Arial, Helvetica, sans-serif;
}

.compare div{
    position: absolute;
}

.leftImage{
	overflow: hidden;
	z-index: 10;
}

.rightImage{
	overflow: hidden;
	z-index: 8;
}

#minDataView{
	position: relative;
	display: block;
}

.mineralTip{
	display: none;
	position: absolute;
/*	border: 2px solid #0591e8;
	background-color: #ddcdc0;
	border-radius: 5px; */
	color: #ffffff;
	padding-bottom: 5px;
	font-size: 1em;
	z-index: 6;
}

#mineralTipDiv{
	position: absolute;
	top: 480px;
	left: 50px;
	width: 80px;
	height: 30px;
	font: 0.875em Arial, sans-serif;
	text-align: left;
	z-index: 6;
}

.formulaTip{
	display: none;
	position: absolute;
	color: #ffffff;
	padding-bottom: 5px;
	font-size: 1em;
	z-index: 6;
}

#formulaTipDiv{
	position: absolute;
	top: 480px;
	left: 146px;
	width: 520px;
	height: 30px;
	font: 0.875em Arial, sans-serif;
	text-align: left;
	z-index: 6;
}

/*Mouseover event needs this*/
.minData{
	top: 0px;
	left: 00px;
	width: 666px;
	height: 499px;
	position: absolute;
	cursor: crosshair;
	z-index: 3;
}

/*#invisibleRock{
	top: 0px;
	left: 00px;
	width: 666px;
	height: 499px;
	z-index: 5;
}*/

.figureCan{
	position: absolute;
	display: block;
	z-index: 4;
}

/*Buttons are invisible unless phaseMap image is selected */
#showSpecbut{
	display: none;
}

#showFormulabut{
	display: none;
}
/*-------------------------Align the spectrum window in the center of the screen--*/
#specView {
	position: relative;
  	top: 220px;
  	left: 330px;
  	transform: translate(-50%, -50%);
	width: 32em;
	height: 24em;
	z-index: 5;
	background-color: #ffffff;
/*	box-shadow: 0 0 2em 4em rgba(0,0,0,0.8);*/
}
#specView img{ 
	width: 100%;
	height: auto;
	overflow: hidden;
}
#specView div.specInfo {
	position: relative;
	top: 30px;
	width: 500px;
/*	transform: translateY(-50%);
	margin-left: auto;
	margin-right: auto;
	width: 32em;
	height: 1em;
	z-index: 11;
	background-color: #ffdeca;
	border: 2px solid black;
	padding: 0.5em;
/*	box-shadow: 0 0 0.3em 0.2em rgba(0,0,0,1);*/
}
/*---To align the text in the center of the feedback division -----*/
#specView div.specInfo p{
	position: relative;
	top: 30px;
	transform: translateY(-50%);
	text-align: right;
	margin-left: auto;
	margin-right: auto;
}

#hideSpecbut {
	position: fixed;
	right: 2.5em;
	top: 4.0em;  
	z-index: 11;
	font-size: 0.6em;
	background-color: #e9e9e9;
	border: 1px solid black;
	box-shadow: 0 0 0.2em 0.1em rgba(0,0,0,0.8);
}
