
@font-face {font-family: 'Arial Nrw'; 
  src: url("arialnb.eot"); /* IE */  
  src: local("Arial Narrow Bold"), url("arialnb.ttf") format("truetype");} /* non-IE */

BODY		{background: #0A1020 url("images/dd-bkg-fade.jpg") repeat-x; margin: 0px 0px 30px 0px;}

* {margin: 0; padding: 0;}

#CONTAINER	{width: 958px; display: table; position: relative; margin:0 auto;}


/* display: table; should not be used on CONTENT to set an elastic 100% auto-height.
   float: left; is necessary on the CONTENT DIV instead to ensure CENTER & RIGHT columns do not 
   slide to bottom of LEFT column in FF, something that occurs in FF with random page loads. 
   This will also allow the background to expand to fill the entire CONTENT space */


#CONTENT	{float: left; width: 950px; background: #E0E6F0 url("images/dd-sub-left.jpg") repeat-y; position: relative; 
		border-left: solid 4px #A10000; border-right: solid 4px #A10000;}

#TOP-LEFT	{float: left; width: 270px; height: 150px; background: #555555 url("images/dd-sub-top-left.png"); position: relative; border-left: solid 4px #A10000;}
#TOP-RGHT	{float: left; width: 680px; height: 150px; background: #000000 url("images/dd-sub-top-rght.png"); position: relative; border-right: solid 4px #A10000;}

#LEFT		{float: left; width: 270px; height: 100%;	 position: relative;}
#MENU		{float: left; width: 270px; height: 354px; background: url("images/dd-sub-menu.jpg") no-repeat; padding-bottom: 12px; position: relative; clear: both;}

#CENTER		{float: left; width: 630px; height: 100%; clear: right; padding: 20px 50px 40px 0px; position: relative;}

#ITEM-HALF	{float: left; width: 300px; margin: 20px 10px 0px 0px; position: relative;}
#ITEM-3RD	{float: left; width: 183px; height: 180px; text-align: center; margin: 0px 20px 20px 0px; position: relative;}
#ITEM-3RD-TALL	{float: left; width: 183px; height: 200px; text-align: center; margin: 0px 20px 20px 0px; position: relative;}

#CLEAR		{float: left; width: 680px; height: 1px; clear: both; position: relative;}

#INSTR-H	{float: left; width: 580px; height: 100%; margin-top: 30px;  position: relative;}
#INSTR		{float: left; width: 210px; height: 100%; position: relative;}

#FOOTER		{float: left; width: 950px; height: 70px;	background: #090f23 url("images/dd-idx-footer.jpg") right no-repeat; position: relative;
		border-left: solid 4px #A10000; border-right: solid 4px #A10000;}
#FTR-SUB	{float: left; width: 315px; text-align: center; position: relative;}
#FTR-SUB P	{color: #FFFFFF; font: 10px Arial; text-align: center; padding: 6px 0px 8px 0px;}


P	{text-align: left; font: 14px Arial; 	color: #041B52; padding: 3px 20px 3px 0px;}
H1	{text-align: left; font: bold 26px Arial; color: #E60000; padding: 6px 0px 3px 0px;}
H2	{text-align: left; font: bold 20px Arial; color: blue;    vertical-align: absbottom;}
H3	{text-align: left; font: bold 16px Arial; color: blue;    padding-bottom: 6px;}
H4	{text-align: left; font: bold 13px Arial; color: #041B52; padding: 24px 0px 0px 0px; vertical-align: middle;}
H5	{text-align: left; font: bold 15px Arial; color: #AA7006; padding: 12px 0px 0px 0px; vertical-align: middle;}
H6	{text-align: left; font: bold 14px Arial; color: #041B52; padding: 12px 10px 3px 0px;}
.H7	{text-align: left; font: bold 12px Arial; color: #041B52; padding: 6px 0px 6px 0px;}
.H8	{text-align: left; font: bold 15px Arial; color: red;     display: inline;}
.H9	{text-align: left; font: bold 14px Arial; color: #BB8107; padding-top: 3px;}
.H10	{text-align: center; font: bold 14px Arial; color: #BB8107; padding: 0;}
.H11	{text-align: center; font: bold 12px Arial; color: #041B52; padding: 1px 0 3px 0;}
.HA	{text-align: left; font: bold 16px Arial; color: #BB8107; padding-bottom: 3px;}
.red	{color: red;}
.grn	{color: green;}
.blu	{color: blue;}
span.msrp	{text-align: left; font: bold 12px Arial; color: blue;}

A		{font: bold 14px Arial; color: #BB8107; text-decoration: underline;}
A:hover	{font: bold 14px Arial; color: red; text-decoration: underline;}

ul		{list-style-type: bullet; text-align: left; padding: 0 0 0 20px;}
ul li		{color: #041B52; font: 13px Arial; padding: 0 20px 0 0; line-height: 18px;}

#nav 		{float: left; width: 198px; padding: 0;}
#nav ul		{list-style-type: none; text-align: left; padding: 0;}
#nav ul li	{padding: 5px 0 3px 0; border-top: 1px solid #6D6D6D;}
#nav ul li.ys	{font: bold 15px Arial; padding: 5px 0 5px 0;}
#nav ul li.x	{line-height: 1px; border-top: 1px solid #7E7E7E;}
#nav ul li a	{color: #000000; background-position: 0 0; padding: 2px 0 2px 0; text-decoration: none;}
#nav ul li.y a	{font: bold 15px Arial; background: url(images/dd-idx-nav-y.png) no-repeat; background-position: 0 0; padding: 3px 0 2px 36px; text-decoration: none;}
#nav ul li.g a	{font: bold 15px Arial; background: url(images/dd-idx-nav-g.png) no-repeat; background-position: 0 0; padding: 3px 0 2px 36px; text-decoration: none;}
#nav ul li.r a	{font: bold 15px Arial; background: url(images/dd-idx-nav-r.png) no-repeat; background-position: 0 0; padding: 3px 0 2px 36px; text-decoration: none;}
#nav ul li.ys a	{font: 14px Arial Nrw;  background: url(images/dd-idx-nav-y.png) no-repeat; background-position: 0 0; padding: 3px 0 3px 36px; text-decoration: none;}
#nav ul li a:hover {color: #C40000; background-position: 0 -22px;}

.copy		{color: #4B4B4B; font: 10px Arial; text-align: center; padding: 0 36px 3px 36px;}
.tiny		{width: 960px; text-align: center; font: 9px Arial; color: #0A1020; padding: 0;}
.viewcart	{padding: 25px;}
.pngfix		{padding-left: 20px;}
.mail		{text-align: left; padding: 0 20px 6px 6px;}
.mail A		{color: #C40000; font: 12px Arial Nrw;}
.mail A:hover	{color: red;}

IMG		{border: 0px; margin: 0px; padding: 0px; text-decoration: none;}
IMG.map	{border: 6px solid #053A00; margin: 10px 0px 10px 0px;}

form 		{margin: 0px;}




#IDX-TOP-LEFT	{float: left; width: 270px; height: 140px; background: #555555 url("images/dd-idx-top-left.png"); position: relative;}
#IDX-TOP-RGHT	{float: left; width: 680px; height: 140px; background: #000000 url("images/dd-idx-top-rght.png"); position: relative;}

#IDX-LOGO-LEFT	{float: left; width: 270px; height: 135px; background: #555555 url("images/dd-idx-logo-left.png"); position: relative;}
#IDX-LOGO-RGHT	{float: left; width: 680px; height: 135px; background: #555555 url("images/dd-idx-logo-rght.png"); position: relative;}

#IDX-CENTER		{float: left; width: 680px; height: 42px;	background: #A20000 url("images/dd-idx-ctr-rght.png"); 
			text-align: center; padding-top: 18px; position: relative;}

#IDX-BTM-LEFT	{float: left; width: 270px; height: 363px; background: gray url("images/dd-idx-btm-left.png"); padding-top: 32px; position: relative;}
#IDX-BTM-RGHT	{float: left; width: 659px; height: 253px; background: #182952 url("images/dd-idx-btm-rght.png"); padding: 12px 15px 0 6px; position: relative;}

#idx-gak P		{color: white; text-align: center; padding: 6px 0 0 0;}
#idx-gak H1		{text-align: center; font: bold 26px Arial; color: #E60000; padding: 0px 0px 0px 0px;}
#idx-gak H2		{text-align: center; font: bold 24px Arial; color: cyan; display: inline;}
#idx-gak H3 		{text-align: center; font: bold 18px Arial; color: cyan; display: inline;}
#idx-gak .H4		{color: white; font: bold 38px Courier New;}
#idx-gak H5		{color: yellow; text-align: center;}
#idx-gak A		{color: yellow; text-decoration: underline;}

#IDX-TOP-LEFT H1		{font: bold 18px Arial; color: yellow; padding: 21px 0px 0px 18px;}
#IDX-TOP-LEFT ul		{list-style-type: bullet; text-align: left; padding-left: 34px;}
#IDX-TOP-LEFT ul li	{padding-top: 7px;}
#IDX-TOP-LEFT a		{font: bold 12px Arial; color: #013AC2; text-decoration: underline;}
#IDX-TOP-LEFT a:hover	{color: blue; text-decoration: underline;}



#IDX-CENTER H1	{color: #FFFFFF; font: bold 20px Trebuchet MS; text-align: center; display: inline;}
#IDX-CENTER H2	{font: bold 20px Trebuchet MS; text-align: center; display: inline; vertical-align: middle;}

#IDX-FOOTER	{float: left; width: 680px; height: 70px;	background: #090f23 url("images/dd-idx-footer.jpg") right no-repeat; position: relative;}




/* contest */

#IDX-TOP-RGHT-CONTEST	{float: left; width: 680px; height: 140px; background: #000000 url("images/dd-idx-top-rght-contest.png"); position: relative;}
#IDX-TOP-RGHT-CONTEST P		{padding: 57px 0px 0px 230px;}
#IDX-TOP-RGHT-CONTEST A		{font: bold 18px Arial; color: yellow; text-decoration: underline;}

.cH1	{text-align: center; font: bold 26px Arial; color: #E60000; padding: 6px 20px 3px 0;}
.cH3	{text-align: center; font: bold 16px Arial; color: blue;    padding: 0 20 6px 0;}
A.ch	{font: bold 24px Arial; color: orange; text-decoration: underline;}
A:hover.ch	{font: bold 24px Arial; color: red; text-decoration: underline;}

/* contest */



/*   l i g h t b o x  */

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#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/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }


/*   l i g h t b o x  */

