/* CSS Document */
html {
height:100%; max-height:100%; /* 100% for IE, max other browsers */
padding:0; margin:0; border:0; 
background:#fff; /* only works in IE */
font-size:100%; font-family: Arial, Helvetica, sans-serif;
/* hide overflow:hidden from IE5/Mac */
/* \*/
overflow:hidden; /*get rid of scroll bars in IE */ }
body {
height:100%; /* fix height to 100% for IE */
max-height:100%; /* fix height for other browsers */
/* overflow:hidden; /*get rid of scroll bars in IE */
padding:0; margin:0; border:0; background: url(j-images/grafix/star_bg.gif); }
img { border: 0; }
/*#header {position:absolute; margin:0; top:-2; right:18px; display:block; width:100%; height:1px; background:#fff;  z-index:5;} */
#middle {display:block; /* set up as a block */
height:100%; max-height:100%; /* set height to full page */
width: 860px;
overflow:auto; /* add scroll bars as required */
padding-left:160px; /* pad left to avoid navigation div if required */
position:relative; /* so z-index works */ 
background: url(j-images/grafix/star_bg.gif);
z-index:3; }

.size { float: right; margin: -1px 2px 0px; z-index: 4; }
.size a:link, .size a:visited { color: #30f; background: #CCC; }
.size a:hover, .size a:focus { color: #30f; background: #FFF;}
*>div.size { position: absolute; left: 0; top: -5000px } /* ie resize - hide from rest */

.pad { display:block; width:18px; height:50px; float:left;}
#pad1 { display:block; height: 0; /* height to miss header and footer */}
#pad2 { display:block; height: 16px; /* height to miss header and footer */}

div#menuwrap { position: absolute; width: 160px; height: 507px; top: 0; left: 0; background: #fff; }
body>div#menuwrap { position: fixed; }

#menu {width: 152px; height: 500px; z-index: 100; margin: 8px 4px 0 4px; }
* html #menu {width: 152px; height: 500px; margin: 8px 4px 0 0; }

.m1 { float: left; width: 152px; height: 57px; background: url(j-images/menu/shop_1.gif) 0 0 no-repeat; margin: 0 4px 2px; }
.m1 a { display: block; width: 100%; height: 100%; background: url(j-images/menu/shop.gif) top left no-repeat; }
.m1 span { display: block; }
.m1 a:hover { background-image: none; }
.m2 { float: left; width: 152px; height: 57px; background: url(j-images/menu/gallery_1.gif) 0 0 no-repeat; margin: 3px 4px 2px; }
.m2 a { display: block; width: 100%; height: 100%; background: url(j-images/menu/gallery.gif) top left no-repeat; }
.m2 span { display: block; }
.m2 a:hover { background-image: none; }
.m3 { float: left; width: 152px; height: 57px; background: url(j-images/menu/jfk_1.gif) 0 0 no-repeat; margin: 3px 4px 2px; }
.m3 a { display: block; width: 100%; height: 100%; background: url(j-images/menu/jfk.gif) top left no-repeat; }
.m3 span { display: block; }
.m3 a:hover { background-image: none; }
.m4 { float: left; width: 152px; height: 57px; background: url(j-images/menu/guests_1.gif) 0 0 no-repeat; margin: 3px 4px 2px; }
.m4 a { display: block; width: 100%; height: 100%; background: url(j-images/menu/guests.gif) top left no-repeat; }
.m4 span { display: block; }
.m4 a:hover { background-image: none; }
.m5 { float: left; width: 152px; height: 57px; background: url(j-images/menu/piercing_1.gif) 0 0 no-repeat; margin: 3px 4px 2px; }
.m5 a { display: block; width: 100%; height: 100%; background: url(j-images/menu/piercing.gif) top left no-repeat; }
.m5 span { display: block; }
.m5 a:hover { background-image: none; }
.m6 { float: left; width: 152px; height: 57px; background: url(j-images/menu/xtras_1.gif) 0 0 no-repeat; margin: 3px 4px 2px; }
.m6 a { display: block; width: 100%; height: 100%; background: url(j-images/menu/xtras.gif) top left no-repeat; }
.m6 span { display: block; }
.m6 a:hover { background-image: none; }
.m7 { float: left; width: 152px; height: 57px; background: url(j-images/menu/info_1.gif) 0 0 no-repeat; margin: 3px 4px; }
.m7 a { display: block; width: 100%; height: 100%; background: url(j-images/menu/info.gif) top left no-repeat; }
.m7 span { display: block; }
.m7 a:hover { background-image: none; }
.m8 { float: left; width: 152px; height: 57px; background: url(j-images/menu/contact_1.gif) 0 0 no-repeat; margin: 3px 4px 2px; }
.m8 a { display: block; width: 100%; height: 100%; background: url(j-images/menu/contact.gif) top left no-repeat; }
.m8 span { display: block; }
.m8 a:hover { background-image: none; }

.m9 { width: 400px; height: 72px; background: url(j-images/menu/logo_1.gif) 0 0 no-repeat; }
.m9 a { display: block; width: 100%; height: 100%; background: url(j-images/menu/logo.gif) top left no-repeat; }
.m9 span { display: block; }
.m9 a:hover { background-image: none; }

/*div#contentwrap { padding:0; margin-left: 240px; background: #f0f;
/*left mar and bottom pad for IE5Win - then others 
voice-family: "\"}\""; voice-family: inherit; margin-left: 240px; padding-bottom: 30px; clear: both; }	
body>div#contentwrap { margin-left: 240px; }*/

#content { position:absolute; left: 160px; top: 0; width: 854px; height: 510px; margin: 0; background: #fff url(j-images/grafix/display_bg.gif) bottom right no-repeat; z-index: 0; }
* html #content { z-index: -1;  width: 856px; height: 509px;  background: url(j-images/grafix/display_bg.gif) bottom right no-repeat; }

#content2a { position:absolute; left: 184px; top: 8px;
	width: 540px; height: 510px; } 
#content2 { position:absolute; left: 174px; top: 8px;
	width: 540px; height: 510px; background: url(j-images/FRONT/frpage2.gif) no-repeat; 
	margin: 0; z-index: 0; padding: 0px 0px 0px; text-align: center;
	font: bold 40px "Times New Roman", Times, serif; color: #30f; }
* html #content2 { left: 174px; z-index: -1; }

#content3 { position: absolute; left: 730px; top: 8px;
			width: 258px; height: 510px; color: #30f; line-height: 22px;
			font: bold 20px "Times New Roman", Times, serif; font-stretch:narrower;
			background: url(j-images/FRONT/front3.gif) no-repeat; overflow-y: auto; }
			
#content4 { position:absolute; left: 180px; top: 8px; width: 700px; height: 492px; margin: 0;
 padding: 12px 20px 20px 12px; background: url(j-images/grafix/contact_bg.gif) top left no-repeat; z-index: 0; }
#contact { width: 668px; height: 458px; overflow-y: auto; }
* html #content { z-index: -1; }
.context { color: #30f; font: normal 1em "Times New Roman", Times, serif; }
#content4 img { margin: 4px 70px; }

#bio { position: absolute; left: 180px; top: 8px; width: 844px; height: 510px; overflow: hidden; background: #fff;}
#biotext { position: absolute; left: 352px; top: 352px; width: 462px; height: 150px; 
		   background: #fff url(j-images/grafix/bio8_bg.gif) top left no-repeat; 
		   font: normal 0.9em "Times New Roman", Times, serif; padding: 8px 4px 8px 8px; color: #30F; ;
		   text-align: left; line-height: 16px; overflow-y: auto;}	
#bio img { margin: 0 8px 8px 0; }

#after { position: absolute; left: 180px; top: 0; padding: 0 8px 8px; margin: 8px 0 0 ; width: 814px; height: 514px; background: url(j-images/grafix/info_bg.gif) no-repeat; }
* html #after { padding: 8px; }

#after ul {list-style: none; margin-left: -8px; }
#after ul li { margin: 0 -1px 0 0;  padding: 0 4px; font: bold 16px 'Times New Roman', Times, serif; color: #30f; display: inline; }
#after ul li a:link, #after ul li a:visited { color: #30f; margin: 0; padding: 0 4px; text-decoration:none; }
#after ul li a:hover, #after ul li a:focus { background: #CCC; }
#after ul li a img {  background: #fff; float: right; margin: -24px 24px 0 0; padding: 0; }
* html #after ul li a img { margin: -18px 24px 0 0; }
#after ul li a:hover img, #after ul li a:focus img {  background: #fff; }
#after ul li a span {display: none; }
#after ul li a:hover span, #after ul li a:active span { color: #30f; display:block; 
	position:absolute; top: 38px; left: 24px; height: 440px; width: 84%; 
	background: #fff; padding:5px 8px; text-decoration: none; text-align: justify; 
	font-weight: normal; overflow-y: auto; }	
* html #after ul li a:hover span, #after ul li a:active span { left: 24px; padding:5px 8px; width: 86%; } 

* + html #after ul li a:hover span, #after ul li a:active span { left: 24px; padding:5px 8px; width: 86%; }

#copy { position: relative; top: 140px; left: 60px; width: 570px; height: 380px; z-index: 200; background: url(a-images/copyright---please_email_XIII_for_info.gif);}	

#head { position: absolute; top: 8px; left: 299px; height: 84px; width: 538px; margin: 0; padding: 2px 12px 0 8px; font: 40px bold Georgia, "Times New Roman", Times, serif; color: #f00; background: url(j-images/grafix/head_bg.gif) no-repeat; text-align: left; }
* html #head { left: 298px; width: 534px; padding: 3px 16px 0 8px;  }
.title { width: 220px; float: left; }
.page { float: right; width: 310px; text-align: right; font-size: 20px; }
.page a { margin: 0 -2px; }
#head a:link, #head a:visited { color: #30f; text-decoration: none; margin: -2px 0; padding: 0 2px;  }
* html a:link, #head a:visited {margin: -1px 0; } 
#head a:hover, #head a:active, #head a:focus { color: #F00; }

#head a img { float: right; padding: 0 3px; }
.no {padding: 0;}

#scrollbox { width: 284px; height: 500px; overflow: hidden; margin: 2px 0 0; padding: 1px 0px 4px 4px; background: #fff url(j-images/grafix/thumb-bg.gif) repeat-y; }
* html #scrollbox { width: 300px; height: 500px; padding: 0 8px 4px 0; background: url(j-images/grafix/thumb-bg-ie.gif) repeat-y; }

a.gallery, a.gallery:visited {display:block; color:#000; text-decoration:none; border:3px solid #30f; width:52px; height:80px; margin: 6px 6px 8px 6px; float:left; }
* html a.gallery, a.gallery:visited {border:3px solid #30f; margin: 7px 6px 7px 6px; float: left; } 

/* gallery code cssplay*/
a.gallery span {display:block; position:absolute; left:150px; top:-1px; width:1px; height:1px; overflow:hidden; background:#fff; z-index:20; }
a.gallery:hover {white-space:normal; border: 3px solid #30f; display: block; background: url(j-images/grafix/bg_gal2.gif); }
html>body a.gallery:hover { background: url(j-images/grafix/bg_gal2.gif); } /* DIFF */
a.gallery:hover img { margin-left: 0px; border: 0; z-index:20;}
a.gallery:active img, a.gallery:focus img { margin-left: 0; border: 0; }

a.gallery:hover span {display:block; position:absolute; width:533px; height:400px; top: 98px; left: 305px; font-style:italic; color:#999; z-index:20; background: #fff; margin: 0; border: 0; }
* html a.gallery:hover span {left: 305px; top: 97px; border: 0; }
a.gallery:active { border: 3px solid #900; }
a.gallery:active span, a.gallery:focus span {display:block; position:absolute; width:533px; height:400px; top: 99px; left: 307px; background:#fff; z-index:10; margin: 0; border-right: 3px solid #900; }
* html a.gallery:active span { display: block; position:absolute; width:533px; height:400px; top: 97px; left: 305px; margin: 0; background:#fff; z-index:10; margin: 0; border-right: 3px solid #900; }
* html a.gallery:focus span { display: block; position:absolute; width:533px; height:400px; top: 97px; left: 305px; margin: 0; background:#fff; z-index:10; margin: 0; border-right: 3px solid #900; }

/* IE7 only - filter in head  */
* + html a.gallery span {display:block; position:absolute; width:530px; height:400px; top: 97px; left:-9999px; font-style:italic; color:#999; background:#fff; z-index:20;}
* + html a.gallery span img {border:3px solid #fff;}
* + html a.gallery:hover {white-space:normal; border:0;}
* + html a.gallery:hover img {border:0; z-index:20;}
* + html a.gallery:active img, a.gallery:focus img {border:0 z-index:10;}
* + html a.gallery:hover span {left: 305px; z-index:10;}
* + html a.gallery:hover span img {border: 0}
* + html a.gallery:active span, a.gallery:focus span {left:305px; z-index:10; }

/*div#footerwrap { width: 100%; height: 20px; position: absolute; bottom: 0; left: 0; background-color: #aaa; }
body>div#footerwrap { position: fixed; }*/

/*#info { width: 570px; height: 514px; margin: 16px 0 110px 60px; 
		font: normal 1em Arial, Helvetica, sans-serif; 
		color: #009; text-align: justify; overflow: auto; }
#info a:link, a:visited { color: #006; text-decoration: none; background: #ccf; padding: 1px 2px; }
#info a:hover, a:active, a:focus { color: #FFF; text-decoration: none; background: #009; 
									padding: 1px 2px; }
*/
div#footer { position:absolute; margin:0; bottom:-1px; right:18px; display:block; width:98%; height: 15px; z-index: 6; background: #CCC; padding: 0 0 1px; text-align: left; font: normal 0.75em  "Times New Roman", Times, serif; line-height: 14px; color: #30f; border-top: 1px solid #33F; }
div#bmark { float: left; width: 30%; margin: 4px 0 0 12px; }
* html div#bmark  { margin: 1px 0 1px 12px; }
div#bmark img { margin: -7px 0 0 6px; }
* html div#bmark img { margin: 0 0 0 6px; }

#bmenu {float: right; margin-top: 2px; }
#bmenu ul { color: #30F; height: 20px; width: 30%; text-align: right; 
		    margin-top: 0; display: inline; }
#bmenu ul li { display: inline; color: #30F; margin: 2px 2px 0 -5px; }
#bmenu ul li a:link, #bmenu ul li a:visited { color: #33F; text-decoration: none; background: #CCC;  padding: 2px 2px 2px 4px; border-left: 1px solid #333; }
#bmenu ul li a:hover, #bmenu ul li a:active, #bmenu ul li a:focus { color: #33F; 
text-decoration: none; background: #FFF; border-left: 1px solid #33F; }


#archive { position: absolute; left: 180px; top: 0; padding: 0 8px 8px; margin: 8px 0 0 ; width: 814px; height: 514px; background: url(j-images/grafix/archive_bg.gif) no-repeat; }
#archive ul {list-style: none; margin: 24px 0; width: 150px; float: left; text-align: center; }
#archive ul li { margin: 12px 0; font: bold 16px 'Times New Roman', Times, serif;  }
#archive ul li a:link, #archive ul li a:visited { color: #30f; margin: 0; padding: 4px; text-decoration:none; }
#archive ul li a:hover, #archive ul li a:focus { background: #fff; }


div.clear {clear: both;}	
 
h3 { float: right; font-weight: bold; border-bottom: 1px dotted #f06; margin: 0 4px; 
	padding-right: 40px; background: url(a-images/hand.jpg) no-repeat top right; }
*> h4 { margin-top: -6px; }