@charset "utf-8";
/* Pop Menu WIDGET CSS Document */
/* minimize to multistate menu icon, pops menu that is 100% width constrained by
   external container */

/* wrap this in a container with a unique id to target these classes for manipulation with jquery -  */



.jwstPopMenuIcon {  /* div to hold ICON as BG image for css manip of states */
width:34px;  /* icon triState graphic is 33px per state wide */
height:34px; /* menu part of the ALL state graphic is at bottom and 24px tall */

background-image:url(../../widgetImageCache/widgetControlsGroup3State.gif);
background-repeat:no-repeat;
background-position: -0px -136px;  /* 4 rows 34px high, using row 5 top is 136px */

margin-left: 10px;
margin-right: 0;
}

.jwstPopMenuIcon:hover {
background-image:url(../../widgetImageCache/widgetControlsGroup3State.gif);
background-repeat:no-repeat;
background-position: -34px -136px;  /* nasa icon triState graphic is 114px per state */
}

.jwstPopMenuIcon.open { 
/* set this with JQUERY, position so CLOSE X is showing with ICON */
background-image:url(../../widgetImageCache/widgetControlsGroup3State.gif);
background-repeat:no-repeat;
background-position: -68px -136px;
}




/*  MENU *************************************/

.jwstPopMenu {
display:none;  /* start hidden */

color:#cccccc;  

width:560px;
max-height:300px;

background-color:transparent;
/* looks better without this ...
background-color:#000000;
background:url(../../widgetImageCache/blackTrans25.png) repeat;
*/

/* remove border for less visual noise  - 4/18/14
border: solid #444444  2px;

border-top-left-radius:0px;
border-top-right-radius:12px;
border-bottom-left-radius:12px;
border-bottom-right-radius:2px;
*/

margin-left: 16px;  /* align with icon */

padding-top: 0px;  /*  was 15px -- */
padding-left: 15px;  /* a little extra on left for extra open gutter on left edge of content */

position:absolute;  /* be sure this is contained in a relative pos element to make it this abs pos be relative to THAT container. */
left:27px;
top: 5px; /* 27/5 icon is 34px tall so a little past that */
z-index: 201;  /* be sure this is above mask layer and header */

overflow:auto;
}

.jwstPopMenu a {
color:#0066FF;
}

.jwstPopMenu a:hover {
	color:#0099FF;
	
}

.jwstPopMenuColumn a {
	color:#0099FF;
	text-decoration:none;
}

.jwstPopMenuColumn a:hover {
	text-decoration:underline;
}



.jwstPopMenuColumn { /*  columns - apply float class separately with generic core.css floatLeft etc */
width:40%;
margin: 1.0%;
margin-top: 18px;
color:#bbbbbb;  /* h, p  and desc text will inherit this. */
}

.jwstPopMenuColumn h2 {
color:#cccccc; 
font-size: 120%;
font-weight:900;
font-family: Arial, sans-serif;
margin:0;
padding:0;
}

.jwstPopMenuColumn p {
font-size: 80%;
margin: 0 0 12px 0; /* assumes there is ONE paragraph immed preceding the nav block */
}


.jwstPopMenuColumn ul {
width:95%;
margin:0 0 10px 2%;
padding:0;
list-style: none;
/* too much viz-noise for bg image with 2 cols
background-image:url(../../widgetImageCache/commentBubblesQnA.gif); 
background-repeat:no-repeat;
background-position: 350px 0px;
*/
}

.jwstPopMenuColumn ul li:first-child{

}
.jwstPopMenuColumn ul li{
	list-style-image:url(../../widgetImageCache/greyRectDull10x10.gif);
}


.jwstPopMenuColumn ul li:hover, .jwstPopMenuColumn ul li .selected {
	list-style-image:url(../../widgetImageCache/greyRectBright10x10.gif);
}


.jwstPopMenuColumn ul li a {
	/* display: block; */
	color:#0099cc;
	font-size: 90%;
	padding: 2px 6px 0px 1px;
	text-decoration:none;
}
.jwstPopMenuColumn ul li a:link {
}

.jwstPopMenuColumn ul li a:hover {
color:#00bbff;
}

.jwstPopMenuColumn ul li a:active {

}

.jwstPopMenuColumn ul li a:visited {

}