/* --- GLOBALS --- */

/*---hiding because they conflict with the main style sheet---
* {
	margin: 0;
	padding: 0;
}
body {
	font-family: arial, helvetica, sans-serif;
	font-size: 80%;
}
img {
	border: 0;
	margin: 0;
	padding: 0;
	text-align: right;
}
*/
.hide {
	display: none;
}

/* --- LAYOUT --- */

/* goes around entire people area */
#imevolv_wrapper {
	overflow: visible;
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 80%;
	position: relative;
	top: 5px; left: 5px;
	width: 310px;
	height: 200px;
	background-color: #023e6c;
}
#imevolv_wrapper img {
	border: 0;
	margin: 0;
	padding: 0;
	text-align: right;
}
	
div.iae_header {
	margin: 0;
	position: absolute;
	top: 0; left: 0;
	width: 288px;
	height: 28px;
	padding: 0 10px;
	background-color: #023662;
	border: 1px solid #01315e;
	font-size: 15px;
	line-height: 28px;
	color: #ffffff;
}

/* holds the people and rolodex, but not the fisheye */
div.iae_area {
	margin: 0;
	padding: 0;
	position: absolute;
	top: 30px; left: 0;
	width: 308px;
	height: 169px;
	background-color: #023e6c;
	border: 1px solid #01315e;
	border-top: 0;
}

/* ======= rows of images ============================================================= */
/* area that holds the rows of small pics */
.grid_container {
	margin: 0;
	padding: 0;
	position: absolute;
	top: 6px; left: 5px;
	width: 300px;
}
.grid_container img {
	margin: 0;
	padding: 0;
	cursor: pointer;
}
/* a row of people images */
div.iae_area .row { 
	margin: 0;
	padding: 0;
	height: 50px; /* image height plus gap below image */
}
div.iae_area .row a:hover { 
/*	margin: 0;
	padding: 0;
	background: url(../images/iglow.gif) no-repeat;  glow around image on hover over */
}
/* a column of people images */
div.iae_area .col { 
	margin: 0;
	padding: 0;
	float: left; /* goes on div around every image, so every image is floated right */
}
div.iae_area .col:hover { /* redundant hover glow */
	margin: 0;
	padding: 0;
	background: url(../images/iglow.png) no-repeat; /* glow around image on hover over */
}	
/* a person's thumbnail image */
.iae_area .thumb { 
	padding: 0 ! important;
	width: 45px ! important;
	height: 45px ! important;
	margin: 2px 3px 2px 2px ! important;
}
/* the glow around an image, applied when sorted */
.glow {
	margin: 0;
	padding: 0;
	background: url(../images/iglow.png) no-repeat; 
}
.roglow {
	margin: 0;
	padding: 0;
	background: url(../images/iglow.png) no-repeat; 
}

/* navy bg */
.fillin {
	background-color: #023e6c;
}

/* ======= icon images ============================================================= */
.iae_area .ibusiness {
	background: url(../images/ibusiness.png) center center no-repeat;
}
.iae_area .icompany {
	background: url(../images/icompany.png) center center no-repeat;
}
.iae_area .iproduct {
	background: url(../images/iproduct.png) center center no-repeat;
}
.iae_area .ibusiness:hover {
	background: url(../images/ibusiness_over.png) center center no-repeat;
}
.iae_area .icompany:hover {
	background: url(../images/icompany_over.png) center center no-repeat;
}
.iae_area .iproduct:hover {
	background: url(../images/iproduct_over.png) center center no-repeat;
}
.ibusiness_title {
	background: url(../images/ibusiness_title.png) top right no-repeat;
}
.icompany_title {
	background: url(../images/icompany_title.png) top right no-repeat;
}
.iproduct_title {
	background: url(../images/iproduct_title.png) top right no-repeat;
}

/* ======= rolodex card ============================================================= */
/* the rolodex card area */
.iae_area .person_info {
	margin: 0;
	padding: 0;
	display: none; 					/* hidden initially */
	position: absolute; 
	top: 6px; left: 5px; 	/* position below the top row */
	width: 299px; 					/* width of rolodex card */
	height: 155px; 					/* height of rolodex card */
	background-color: #95c2e3; /* rolodex card bg */
	color: #49530f;
}
/* rolodex card close button */
.iae_area .person_info .close { 
	margin: 0;
	padding: 0;
	position: absolute; 
	top: 5px; left: 275px; /* position at top right */
	width: 14px; 
	height: 14px; 
	background: url(../images/Close_Up.png) no-repeat; /* x img */
	cursor: pointer; 
}
/* rolodex card close button hover */
.iae_area .person_info .close:hover {
	margin: 0;
	padding: 0;
	position: absolute;
	top: 5px; left: 275px;
	width: 14px;
	height: 14px;
	background: url(../images/Close_Over.png) no-repeat;
	cursor: pointer;
}
/* a person's larger image, on the rolodex card */
.iae_area .headshot { 
	padding: 0 ! important;
	width: 80px ! important; 
	height: 80px ! important; 
	margin: 23px 6px ! important; 
}	
/* person's name on rolodex card */
.fullname { 
	margin: 0;
	padding: 0;
	position: absolute; 
	top: 3px; left: 6px; 
	font-size: 12px; 
	color: #01315e; 
}
/* accordian list in the rolodex */
.accordion { 
	margin: 0;
	padding: 0;
	width: 195px; 
	position: absolute; 
	top: 21px; left: 92px; 
	border: 1px solid #95c2e3;
}
/* title */
.accordion dt { 
	margin: 0;
	padding: 5px ! important; 
	background: url(../images/dt_bg.png) repeat-x;
	font-size: 10px; 
	font-weight: bold; 
	line-height: 10px; 
	color: #216394; 
	border-top: 1px solid #95c2e3;
}
/* hidden/shown info */
.accordion dd { 
	margin: 0;
	overflow: hidden; 
	padding: 3px 5px 4px 5px; 
	height: 19px;
	background: url(../images/dd_bg.png) repeat-x; 
	font-size: 10px; 
	color: #444444;
}
/* title on hover */
.accordion dt.myAccordionHover { 
	margin: 0;
	padding: 0;
	background: url(../images/dt_bg.png) repeat-x; 
}
/* title on active */
.accordion dt.myAccordionActive { 
	margin: 0;
	padding: 0;
	background: url(../images/dt_bg.png) repeat-x; 
}