/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.stunicholls.com/menu/photo_click.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

#gContents > p {
	margin:10px;
	padding:8px;
	/*font-family: verdana, arial, sans-serif;*/
	font-size: .9em;
	line-height: 1.6em;
}
#gContentsX h2 {
	background-color: #edf2f8;
	color: #6f454e;
	margin-top: 10px;
	padding: 8px;
	font-family: Times, Verdana, Helvetica, Arial, sans-serif;
	letter-spacing: 2px;
	font-weight: bold;
	font-size: 1.4em;
	font-variant: small-caps;
	border-left: 10px solid #b1c0cf;
	border-right: 10px solid #b1c0cf;
}
#gContentsX h3 {
	background-color: #edf2f8;
	padding: 8px;
	color: #6f454e;
	margin: 10px 10px;
	font-size: 1.2em;
	font-weight: normal;
}

.gallery {
	height: 409px;
	width:728px; 
	position: relative;
	margin: 3px;
	padding: 0;
	border: 1px solid #b1c0cf;
	background-color: #edf2f8;
}
.gallery img {
	background-color: transparent;
	margin: 0;
	padding: 0;
}
.gallery ul {
	list-style: none;
	padding: 0;
	margin: 0;
	width: 291px;
	float: left;
	height: 237px;
	overflow: auto;
	text-align:center;
	border: 1px solid #b1c0cf;
	background-color: white;
	margin-top: 168px;
	margin-left: 2px;
}

.gallery ul li {
	display: inline;
	float: left;
	
	width: 67px;
	height: 75px;
	
	width: 84px;
	height: 72px;

	margin: 0;
	border-right: 1px solid #b1c0cf;
	border-bottom: 1px solid #b1c0cf;
	padding: 2px;
	cursor: pointer;
	text-align:center;
	background-color: #fffafa;
}

.gallery ul li img {
	display: block;
/*
	width: 90px;
	height: 100px;
*/	
	width: 67px;
	height: 75px;

	width: 84px;
	height: 72px;

	padding: 0;
	top: 0;
	border-width:0;
}
.gallery ul li span {
	display: none;
	position: absolute;
	left: 2px;
	top: 38px;
	width: 276px;
	height: 117px;
	font-family: verdana, arial, sans-serif;
	text-align: justify;
	border-top: 0;
	overflow: auto;
	padding: 4px 7px 5px 8px;
	color: #666666;
	border: 1px solid #b1c0cf;
	border-bottom-widthXX: 0;
	background-color: white;
	line-height: 15px !important;
	font-size: 11px !important;
	text-align: left;
}
.gallery ul li span b { color: #6f454e; }

.gallery span p {
	margin:0 0 6px 0;
	padding:0 5px 0 0;
	line-height: 15px !important;
	font-size: 11px !important;
	text-align: left;
}

.gallery ul li span.title {
	positionX: absolute;
	left: 2px;
	top: 2px;
	width: 498px;
	height: 32px;
	/* top: 290px; */
	font-family: verdana, arial, sans-serif;
	font-size: 0.9em;
	line-height: 30px;
	text-align: justify;
	border: 0;
	color: #6f454e;
	background-color: #f8edee;
	background-colorX: #981b37;
	padding: 0px 10px 0px 14px;
	margin:0;
	text-align: right;
	borderX: 1px solid #728da8;
	floatX: left;
}
.gallery ul li span.links {
	positionX: absolute;
	left: 508px;
	top: 2px;
	width: 200px;
	height: 32px;
	/* top: 290px; */
	font-family: verdana, arial, sans-serif;
	font-size: 0.9em;
	line-height: 30px !important;
	text-align: justify;
	border: 0;
	color: #6f454e;
	background-color: #f8edee;
	padding: 0px 5px 0px 14px;
	margin:0;
	text-align: right;
	borderX: 1px solid #728da8;
	floatX: right;
}
/*h1 span.links {
	floatX: right;
	position: absolute;
	left: 620px;
	top: 226px;
	width: 230px;
	text-align: right;
	line-height: 20px !important;
	color: #b1c0cf;
	font-size: 0.65em;
	borderX: 1px solid #728da8;
	displayX: inline;
}*/

.gallery ul li span.title {
	floatX:left;
}

.gallery ul li span.title h3 {
	float:left;
	font-size: 16px !important;
	line-height: 30px !important;
	font-variant: small-caps;
	font-weight: bold;
	display: inline;
	padding: 0;
	margin: 0;
	color: #6f454e;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}

.gallery ul li span.title small,
.gallery ul li span.links small {
	color: #6f454e;
	font-size: 11px;
	font-weight:normal;
	line-height: 30px;
	floatX:right;
	vertical-alignX: middle;
}
.galleryX ul li span.links > small {
	float:right;
}
.gallery ul li span.links a {
	padding: 4px 3px;
	border-rightX: 1px dotted #a9a9a9;
	border: 1px outset #f8edee;
	text-decoration: none;
	background-color: #fffafa;
}
.gallery ul li span.links a blink {
	color: #ff4500;
}
.gallery ul li span.links a:first-child {
	border-leftX: 1px dotted #455a6f;
}
.gallery ul li span.links a:hover {
	background-color: white;
	colorX: #6f454e;
	/*border-top: 1px solid #cfb1b8;*/
	border-rightX: 2px solid #981b37;
	border-bottomX: 2px solid #981b37;
	border: 1px inset #981b37;
}


.gallery ul li.click {
	/*border-color: #66ccff;*/
	/*background-color: #ddeeff;*/
	cursor: default;
	/*background: #cccccc url(products/images/basque_berets_main.png) no-repeat center ;*/
	/*background: #cccccc url(images/right.gif) no-repeat center ;*/
	backgroundX: #edf2f8 url(images/32-loading.gif) no-repeat center ;
	background: white url(images/icons/sm-arrow-right.gif) no-repeat center ;
}

.gallery ul li a.zoom,
.gallery ul li a.order,
.gallery ul li a.info {
	display: none;
	padding: 2px 2px 18px 2px;
	position: absolute;
	font-size: 9px !important;
	line-height: 11px !important;
	color: transparent;
	top: 354px;
	heightX: 10px;
	vertical-alignX: baseline;
	text-align: center;
	width: 24px;
}
* html .gallery ul li a.info,
* html .gallery ul li a.order,
* html .gallery ul li a.zoom {
	padding: 2px 2px 18px 2px;
	font-size: 9px !important;
	line-height: 11px !important;
	top: 356px;
	color: #b1c0cf;
}
.gallery ul li a.zoom {
	background: url(images/icons/16-zoom.png) no-repeat bottom;
	left: 366px;
}

.gallery ul li a.info {
	background: url(images/icons/16-info.png) no-repeat bottom;
	left: 306px;
}

.gallery ul li a.order {
	background: url(images/icons/16-cart.png) no-repeat bottom;
	left: 336px;
}

.gallery ul li a.orderB,
.gallery ul li a.infoB,
.gallery ul li a.zoomB {
	font-size: 0.8em;
	line-heightX: 21px;
}
.gallery ul li a.orderB {
	background: transparent url(images/icons/16-cart-blue.png) no-repeat 2px 2px;
	padding-left: 20px !important;
}
.gallery ul li a.infoB {
	background: transparent url(images/icons/16-info-blue.png) no-repeat 2px 2px;
	padding-left: 20px !important;
}
.gallery ul li a.zoomB {
	background: transparent url(images/icons/16-star.png) no-repeat 1px 2px;
	padding: 0px;
	padding-left: 12px !important;
}

.gallery ul li a.info:hover,
.gallery ul li a.zoom:hover,
.gallery ul li a.order:hover {
	color: #6f454e;
	background-color: #f8edee;
	text-decoration: none;
	backgroundX: url(images/fade_top.png) repeat-x top left;
}

.gallery ul li.iehover a.zoom,
.gallery ul li.iehover a.order,
.gallery ul li.iehover a.info,
.gallery ul li.click:hover a.zoom,
.gallery ul li.click:hover a.order,
.gallery ul li.click:hover a.info {
	display: block;
	colorX: #6f454e;
}

.galleryX ul li.click:hover a {
	display: block;
}

.gallery ul li.click i {
	position: absolute;
	left: 297px;
	top: 38px;
	width: 427px;
	height: 367px;
	border-top: 1px solid #b1c0cf;
	border-left: 1px solid #b1c0cf;
	border-right: 1px solid #b1c0cf;
	border-bottom: 1px solid #b1c0cf;
	border-left-widthX: 0;
	background-imageXXX: url(themes/cnh/bg-tile.jpg);
	background-colorX: #666666;
}

.gallery ul li.click i img {
	margin: 2px auto 0 auto;
/*	width: auto; */
	width: 420px;
	height: 360px;
	border: 1px solid #b1c0cf;
}

/* required for IE5.x and IE6 to display the start image size correctly */
.gallery ul li.click i img.default {
	margin: 5px auto 0 auto;
	width: 320px;
	height: 242px;
	border: 1px solid #f8edee;
}

.gallery ul li.click span { display: block; }

.gallery ul li.off { display: none; }

#headerXXX {
	display: none;
}
/*
.gallery ul li:first-child,.gallery ul li:first-child img {
	width: 407px;
	height: 20px;
}
*/
/*
.gallery ul li:first-child,.gallery ul li:first-child img {
	width: 90px;
	height: 201px;
}
*/


#sections {

}

div.section {
	padding: 5px 0 5px 0;
	heightX: auto;
}

#sections ul {
	margin: 0 10px 0 40px;
	padding: 5px;
	heightX: auto;
}

#sections li {
	margin: 0 20px 10px 0;
	padding: 10px 5px 10px 5px;
	float: left;
	width: 130px;
	height: 145px;
	border:3px double #edf2f8;
	text-align: center;
}

#sections a {
	color: #455a6f;
	padding: 10px 0 0 0;
	text-decoration: none;
	font-size: 0.8em;
	font-variant:small-caps;
}
* html #sections a {
	font-size: 1.1em;
	line-height: 1.2em;
}
#sections ul li:focus,
#sections ul li:hover {
	color: #455a6f;
	background-color: #fffafa;
	border-color: #455a6f;
}

#sections ul li:focus a,
#sections ul li:hover a,
#sections a:focus,
#sections a:hover {
	color: #981b37;
}

#sections ul li a img {
	border: 1px dotted #b1c0cf;
	margin: 0 0 10px 0;
	padding: 0;
	background-color: transparent;
}

/* ================================ */

#lightbox{
	position: absolute;
	left: 0;
	margin:0;
	padding:0;
	width: 100%;
	widthX:1200px;
	z-index: 200;
	text-align: center;
	line-height: 0;
}
#lightbox img{
	margin:0;
	padding:0;
	width: 100%;
	height: 100%;
}
#lightbox a img{ border: none;margin:0;padding:0;}

#outerImageContainer{
	position: relative;
	background-color: #455a6f;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	background-image: url(themes/cnh/bg-tile.jpg);
}
#imageContainer{ padding: 10px; }

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#loading a#loadingLink img{
	width: 126px;
	height: 22px;
}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */
	display: block;
}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover {
	background: url(images/prev.gif) left 15% no-repeat;
}
#nextLink:hover, #nextLink:visited:hover {
	background: url(images/next.gif) right 15% no-repeat;
}

#imageDataContainer{
	font: 11px Verdana, Helvetica, sans-serif;
	background-color: #f8edee;
	margin: 0 auto;
	line-height: 1.8em;
	overflow: auto;
	width: 100%;
	border-topX: thin solid #7690a9;
	border-bottomX: 4px solid #6f454e;
}

#imageData{
	padding: 0 10px;
	color: #981b37;
}
#imageData #imageDetails{
	width: 95%;
	float: left;
	text-align: left;
	line-height: 2em;
}	
#imageData #caption{font-weight: bold;}

#imageData #numberDisplay{
	color: #a8727e;
	display: block;
	clear: left;
	padding-bottom: 0.4em;
}			
#imageData #bottomNavClose{
	width: 10px;
	float: right;
	margin: 5px 0 4px 0;
	outline: none;
	width: 2%;
	vertical-align: top-text;
}	 	
#imageData #bottomNavClose img{
	background-colorX: #a8727e;
	width: 100%;
	paddingX: 1px;
	border: 1px solid #a8727e;
}

#overlay{
	position: fixed;
	top: 0;
	left: 0;
	text-alignX: center;
	marginX:0;
	paddingX:0;
	width: 100%;
	widthX: 1200px;
	height: 700px;
	background-color: #6f454e;
	z-index: 190;
	background-image: url(themes/cnh/bg-tile-blue.jpg);
	background-image_: url(products/images/huge/000.jpg);
}

#imageData #caption i {
	font-weight: normal;
	float: right;
	font-variantX: small-caps;
	font-size: 1em;
	letter-spacing: 0;
	colorX: #a8727e;
	border-bottomX: thin solid #b1c0cf;
}
#imageData #numberDisplay span {
	font-weight: normal;
	float: right;
	font-size: 1em;
	letter-spacing: 0;
	font-variant: normal;
	colorX: #a8727e;
	border-top: thin solid #a8727e;
}
