/*	================= IMAGE ENGINE STYLE START HERE ================= */
#image-engine-wrapper
{
	position: relative;
	width: 740px;
	height: 768px;
	margin-left: -10px;
	color: rgb(128,128,128);
	background-color: black;
	margin-top: 158px;
	margin-bottom: 24px;
	padding-bottom: 32px;
}
div#image-engine-wrapper.new-art
{
	width: 720px;
	margin-left: 0;
}
#image-container
{
	position: absolute;
	width: 768px;
	height: 768px;
	top: 0;
	left: 0;
}

#thumbnail-container
{
	position: absolute;
	left: 0;
	right: 0;
	height: 128px;
	top: -128px;
}

#slide-tray-holder
{
	position: absolute;
	left: 31px;
	top: 15px;
	right: 31px;
	bottom: 15px;
	border: 1px rgb(81, 81, 81) solid;
	background-color: black;
	color: rgb(128,128,128);
	text-align: center;
}

#slide-tray-holder p
{
	position: absolute;
	left: 0;
	right: 0;
	height: 96px;
	vertical-align: middle;
	line-height: 96px;
	padding: 0;
	margin: 0;
}

#slide-tray
{
	position: absolute;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	margin: 0;
	overflow: hidden;
	background-color: black;
	background-image: url(/img/ie/thumb-well.png);
	background-repeat: repeat-x;
	visibility: hidden;
}

#slide-tray dd { display: none; }

#slide-tray dt a, #slide-tray li a
{
	position: absolute;
	width: 96px;
	height: 96px;
	top: 0;
	left: 0;
}

#ic-left-button, #ic-right-button
{
	position: absolute;
	width: 64px;
	height: 64px;
	top: 32px;
	color: white;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: left;
	visibility: hidden;
}

#ic-left-button
{
	left: 0;
	background-image: url(/img/ie/arrow-previous.png);
}

#ic-right-button
{
	right: 0;
	background-image: url(/img/ie/arrow-next.png);
}

#ic-left-button:hover, #ic-right-button:hover
{
	background-position: center;
	cursor: pointer;
}

#ic-left-button:active, #ic-right-button:active
{
	background-position: right;
	cursor: pointer;
}

#ic-description
{
	position: absolute;
	height: auto;
	width: auto;
	left: 0;
	right: 0;
	bottom: 32px;
	text-align: center;
	color: rgb(192,192,192);
	background-color: transparent;
	font-size: 12px;
	visibility: hidden;
	padding: 16px 32px;
	background-image: url(/img/ie/desc_bg.png);
}

#ic-description p { margin: 0; }

#ic-description #iess-counter
{
	position: absolute;
	left: 16px;
	top: 16px;
	width: auto;
	font-weight: bold;
	font-size: 10px;
	color: rgb(128,128,128);
	background-color: transparent;
}

#image-engine-wrapper:hover #ic-description { visibility: visible; }

#ic-description:hover
{
	color: white;
	background-color: black;
}

#attribution
{
	position: absolute;
	height: 32px;
	left: 0;
	right: 0;
	bottom: 0px;
}

#attribution p
{
	position: absolute;
	width: auto;
	height: 32px;
	right: 0;
	line-height: 32px;
	vertical-align: middle;
	font-size: 10px;
	padding: 0;
	margin: 0 10px 0 0;
}

#attribution p a
{
	color: rgb(64,64,64);
	background-color: inherit;
}

#attribution p a:hover
{
	color: rgb(255,255,255);
	background-color: inherit;
}

#tc-left-button, #tc-right-button
{
	position: absolute;
	top: 15px;
	width: 23px;
	height: 90px;
	padding: 4px;
	color: white;
}

#tc-left-button
{
	left: 0;
	background-color: black;
	background-image: url(/img/ie/frame-left.png);
	background-repeat: no-repeat;
}

#tc-right-button
{
	right: 0;
	background-color: black;
	background-image: url(/img/ie/frame-right.png);
	background-repeat: no-repeat;
}

#tc-left-button a, #tc-right-button	a
{
	position: absolute;
	width: 24px;
	height: 88px;
}

#tc-left-button a
{
	color: white;
	background-color: transparent;
	background-image: url(/img/ie/tn-arrow-left.png);
	background-repeat: no-repeat;
	background-position: left;
	visibility: hidden;
}

#tc-right-button a
{
	color: white;
	background-color: transparent;
	background-image: url(/img/ie/tn-arrow-right.png);
	background-repeat: no-repeat;
	background-position: left;
	visibility: hidden;
}

#tc-left-button a:hover, #tc-right-button a:hover
{
	background-position: center;
	cursor: pointer;
}

#tc-left-button a:active, #tc-right-button a:active
{
	background-position: right;
	cursor: pointer;
}

#loading
{
	position: absolute;
	width: 126px;
	height: 14px;
	bottom: 50%;
	left: 321px;
}

/*	
	The following styles define the appearance of the frame around the slide thumbnails.
	They have no affect on the function of the Image Engine; removing them will not affect
	on the operation, just the appearance.
*/

#tc-top-left, #tc-top-right, #tc-bottom-left, #tc-bottom-right
{
	position: absolute;
	width: 15px;
	height: 15px;
}

#tc-top-left
{
	left: 0;
	top: 0;
	background-image: url(/img/ie/frame-top-left.png);
	background-repeat: no-repeat;
}

#tc-top-right
{
	right: 0;
	top: 0;
	background-image: url(/img/ie/frame-top-right.png);
	background-repeat: no-repeat;
}

#tc-top, #tc-bottom
{
	position: absolute;
	height: 15px;
}

#tc-top
{
	top: 0;
	left: 15px;
	right: 15px;
	background-image: url(/img/ie/frame-top.png);
	background-repeat: repeat-x;
}

#tc-bottom
{
	left: 0;
	right: 0;
	bottom: 0;
	background-color: black;
}

