@charset "utf-8";
/* mainNav CSS Document */

/* INSTANCE SPECIFIC CSS ****************************************************************
   below is defined an INSTANCE of jwstNav widget usage. 
   each defines a unique ID for JS handling and SPECIFIC POSITION and SIZING WRAPPER ID.
   
   !!!MOD: poss wrappers should be defined in TARGET html page, so INSTANCE wrappers are
   defined IN the page needed - helps to visualize and localize code specific to page.
   decide on a paradigm, I think this is it, and standardize on all widgets.
****************************************************************************************/


/* INSTANCE SPECIFIC WRAPPER IDS, size and position ************************************/

/* JWST MAIN NAV sizing and position - used on home page and internal pages */
#jwstMainNav {  
width:230px;
overflow:hidden;

background-color:transparent;

position:relative;  /* this is relative to the pageWrapper container */
top: 435px;  /* was 405 */
left:70px;

z-index:98; /* below mask layer */
}




/* GENERIC JWST NAV WIDGET CLASSES *************************************************************/

.jwstNav {
	font-weight:bold;
	font-size: 90%;
	width:100%;  /* of container */  

/*
	position:absolute;
	z-index:100;
	top:0px;
	left:0px;  
*/

/* border: solid 1px #eeeeee;  */

}

.jwstNav ul {
width:90%;
margin:0 0 0 0;
padding:0;
list-style: none;
}

.jwstNav ul li{
	/* was 
	background-color:#FFCC00;
	border-left: solid 8px #000000;
	opacity: .3;  /* might fill with png image later to accom more browser, TEST, this is quick first cut */
	
display:block;
width:100%;
height:20px;
padding: 2px 0 2px 10px;
margin-bottom: 1px;
font-size:12px;
font-weight:bold;

color:#cccccc;
background-image:url(/web/20150909130942oe_/http://jwst.nasa.gov/widgets/widgetImageCache/whiteTrans12.png);
background-repeat:repeat;

text-decoration:none;

}


.jwstNav ul li:hover {
	/* was 
	border-left: solid 8px #7b6404;  
	opacity:.7;
	*/

color:#000000;
background-image:none;
background-image:url(/web/20150909130942oe_/http://jwst.nasa.gov/widgets/widgetImageCache/goldTrans50.png);
background-repeat:repeat;
width:105%;

}

.jwstNav ul li.selected {
background-image:url(/web/20150909130942oe_/http://jwst.nasa.gov/widgets/widgetImageCache/goldTrans75.png);
background-repeat:repeat;		
}

.jwstNav ul li.selected a {
color:#000000;
}

.jwstNav ul li a {
	display: block;
	color: #cccccc;
	width: 80%;  /* need room for margins and hightlight character */
	padding: 3px 6px 3px 6px;
	line-height:18px;
	margin-bottom:2px;
	text-decoration:none;
}
.jwstNav ul li a:link {
}
/* fill in first button to show start state */
/*
.jwstNav ul li:first-child a:link {
	background:yellow;
}
*/
.jwstNav ul li a:hover {
text-decoration:none;
}

.jwstNav ul li a:active {
}

.jwstNav ul li a:visited {
}




/* JWST SOCIAL  *************************************************************/

/* home page social links in 3x3 grid */
.jwstSocialLinks3x3 {
width:94.5%;  /* match width of UL for mainnav*/  
background-image:url(/web/20150909130942oe_/http://jwst.nasa.gov/widgets/widgetImageCache/whiteTrans12.png);
background-repeat:repeat;

}


.jwstSocialLinks3x3 ul {
width:90%;
padding:8px 0 8px 30px;
margin:0;
list-style: none;
}

.jwstSocialLinks3x3 ul li{
display:block;
float:left;
text-decoration:none;

}

.jwstSocialLinks3x3 ul li:hover {

}

.jwstSocialLinks3x3 ul li a {
display:block;
width:32px;
height:32px;
padding: 10px;	

}
.jwstSocialLinks3x3 ul li a:link {
}

.jwstSocialLinks3x3 ul li a:hover {
background-image:url(/web/20150909130942oe_/http://jwst.nasa.gov/widgets/widgetImageCache/whiteTrans25.png);
background-repeat:repeat;
}

.jwstSocialLinks3x3 ul li a:active {
}

.jwstSocialLinks3x3 ul li a:visited {
}

.jwstSocialLinks3x3 ul li a img{
padding:0;
margin:0;
border:none;
}
