rlm@3: body{ rlm@3: background:#000; rlm@3: } rlm@3: #gallery #galleries #controls { rlm@3: height: 17px; rlm@3: padding: 3px; rlm@3: margin:0 auto; rlm@3: width:754px; rlm@3: border-bottom:1px solid #333; rlm@3: text-align:left; rlm@3: background-image: url(controls_bg.png); rlm@3: background-repeat: repeat-x; rlm@3: color:#333; rlm@3: } rlm@3: #gallery #thumbnails { rlm@3: height: 55px; rlm@3: text-align: center; rlm@3: width: 672px; rlm@3: margin: 0 auto 0; rlm@3: overflow: hidden; rlm@3: position: relative; rlm@3: } rlm@3: #gallery { rlm@3: font: 78% Arial, Helvetica, sans-serif; rlm@3: width: 800px; rlm@3: margin: 0 auto; rlm@3: height: 600px; rlm@3: position: relative; rlm@3: overflow: hidden; rlm@3: z-index: 1; rlm@3: } rlm@3: #gallery #galleries { rlm@3: background: #333 url(images_bg.png) repeat-x; rlm@3: position: absolute; rlm@3: left:19px; rlm@3: bottom: -575px; rlm@3: height: 598px; rlm@3: width: 760px; rlm@3: text-align: center; rlm@3: z-index: 50; rlm@3: cursor: pointer; rlm@3: border:1px solid #333; rlm@3: } rlm@3: #images { rlm@3: height: 508px; rlm@3: text-align: center; rlm@3: position: relative; rlm@3: width:760px; rlm@3: overflow: hidden; rlm@3: margin:0 auto 0; rlm@3: background: #333 url(images_bg.png) repeat-x; rlm@3: border-left: 1px solid #333; rlm@3: border-right: 1px solid #333; rlm@3: border-top: solid #333 1px; rlm@3: } rlm@3: rlm@3: #imagewrap { rlm@3: position:absolute; rlm@3: margin:0 auto; rlm@3: width: 0px; rlm@3: height: 0px; rlm@3: top: 200px; rlm@3: left: 380px; rlm@3: } rlm@3: #imgsrc{ rlm@3: cursor: pointer; rlm@3: } rlm@3: #thumbnailwrap { rlm@3: left: 0px; rlm@3: position: absolute; rlm@3: } rlm@3: .thumbnail { rlm@3: background: #333; rlm@3: margin: 7px 6px; rlm@3: float: left; rlm@3: height: 42px; rlm@3: width: 42px; rlm@3: border: solid #333 1px; rlm@3: cursor: pointer; rlm@3: overflow:hidden; rlm@3: } rlm@3: #gallery #thumbbox { rlm@3: width: 760px; rlm@3: margin:0 auto; rlm@3: position:relative; rlm@3: border:1px solid #333; rlm@3: background: url(thumbwrap.png) no-repeat; rlm@3: padding: 8px 0 0 0; rlm@3: overflow: hidden; rlm@3: height: 57px; rlm@3: } rlm@3: #loading { rlm@3: height: 87px; rlm@3: width: 150px; rlm@3: position: absolute; rlm@3: background-image: url(loading.png); rlm@3: background-repeat: no-repeat; rlm@3: background-position: center center; rlm@3: z-index: 8888; rlm@3: left: 311px; rlm@3: top: 189px; rlm@3: } rlm@3: .gallery { rlm@3: float: left; rlm@3: height: 200px; rlm@3: width: 250px; rlm@3: background-image: url(gallery_bg.png); rlm@3: background-repeat: no-repeat; rlm@3: background-position: center center; rlm@3: position: relative; rlm@3: } rlm@3: #gallery #next { rlm@3: height: 510px; rlm@3: width: 19px; rlm@3: background-image: url(next.png); rlm@3: background-repeat: no-repeat; rlm@3: background-position: right center; rlm@3: position: absolute; rlm@3: right: 0px; rlm@3: cursor: pointer; rlm@3: z-index: 5; rlm@3: } rlm@3: #gallery #previous { rlm@3: height: 510px; rlm@3: width: 19px; rlm@3: background-image: url(prev.png); rlm@3: background-repeat: no-repeat; rlm@3: background-position: left center; rlm@3: position: absolute; rlm@3: left: 0px; rlm@3: cursor: pointer; rlm@3: z-index: 5; rlm@3: } rlm@3: #loading #loadingbar { rlm@3: position: relative; rlm@3: width: 100%; rlm@3: height: 87px; rlm@3: } rlm@3: #loading #loadingbar #bar { rlm@3: position: absolute; rlm@3: bottom: 19px; rlm@3: left: 44px; rlm@3: width: 50px; rlm@3: height: 50px; rlm@3: } rlm@3: #largeimage { rlm@3: height: 0px; rlm@3: width: 0px; rlm@3: position: absolute; rlm@3: z-index: 99; rlm@3: overflow: visible; rlm@3: } rlm@3: #backdrop { rlm@3: background-color: #000; rlm@3: height: 0px; rlm@3: width: 0px; rlm@3: position: absolute; rlm@3: z-index: 98; rlm@3: left: 50%; rlm@3: top: 0px; rlm@3: cursor:pointer; rlm@3: } rlm@3: #largeimage #closebtn { rlm@3: background-image: url(closebtn.png); rlm@3: background-repeat: no-repeat; rlm@3: background-position: center center; rlm@3: height: 28px; rlm@3: width: 28px; rlm@3: z-index: 100; rlm@3: position: absolute; rlm@3: left: -8px; rlm@3: top: -8px; rlm@3: cursor:pointer; rlm@3: } rlm@3: #galleryset .gallery h3 { rlm@3: font-size: 1.5em; rlm@3: font-weight: bold; rlm@3: color: #666666; rlm@3: margin: 10px 15px; rlm@3: padding: 0px; rlm@3: } rlm@3: .tooltips{ rlm@3: z-index: 9999999; rlm@3: } rlm@3: .tip { rlm@3: font:Arial, Helvetica, sans-serif; rlm@3: color: #CCC; rlm@3: width: 220px; rlm@3: } rlm@3: .tip-top { rlm@3: margin: 0; rlm@3: color: #CCCCCC; rlm@3: padding: 37px 30px 0px 30px; rlm@3: background: url(tip-top.png) top left; rlm@3: } rlm@3: .tip-title{ rlm@3: font-weight:bold; rlm@3: font-size: 1.3em; rlm@3: margin: 0; rlm@3: color: #FFF; rlm@3: padding: 0px 30px 3px 30px; rlm@3: background: url(tip-middle.png) bottom right; rlm@3: } rlm@3: .tip-text { rlm@3: font-size: 1em; rlm@3: padding: 5px 30px 0px 30px; rlm@3: background: url(tip-middle.png) bottom right; rlm@3: } rlm@3: .tip-bottom { rlm@3: padding: 0px 25px 42px; rlm@3: background: url(tip-bottom.png) bottom right; rlm@3: } rlm@3: .minitooltips{ rlm@3: z-index: 9999999; rlm@3: } rlm@3: .minitooltips .tip { rlm@3: color: #FFF; rlm@3: width: 130px; rlm@3: } rlm@3: .minitooltips .tip-top { rlm@3: margin: 0; rlm@3: color: #CCCCCC; rlm@3: padding: 9px 12px 0px 12px; rlm@3: background: url(minitop.png) top left; rlm@3: } rlm@3: .minitooltips .tip-title{ rlm@3: font:Georgia, "Times New Roman", Times, serif; rlm@3: text-align:center; rlm@3: font-weight:normal; rlm@3: font-size: .8em; rlm@3: margin: 0; rlm@3: color: #FFF; rlm@3: padding: 0px 12px 3px 12px; rlm@3: background: url(minimiddle.png) bottom right; rlm@3: } rlm@3: .minitooltips .tip-text { rlm@3: text-align:center; rlm@3: font-size: .9em; rlm@3: padding: 8px 12px 0px 12px; rlm@3: background: url(minimiddle.png) bottom right; rlm@3: } rlm@3: .minitooltips .tip-bottom { rlm@3: padding: 0px 12px 8px; rlm@3: background: url(minibottom.png) bottom right; rlm@3: } rlm@3: .gallery .galleryimg { rlm@3: position: absolute; rlm@3: left: 23px; rlm@3: top: 37px; rlm@3: } rlm@3: #gallery #thumbbox #thumbleft { rlm@3: width: 40px; rlm@3: height: 65px; rlm@3: left: 0px; rlm@3: position: absolute; rlm@3: background: url(left_arrow.png) no-repeat center center; rlm@3: visibility: hidden; rlm@3: cursor: pointer; rlm@3: } rlm@3: #gallery #thumbbox #thumbright { rlm@3: height: 65px; rlm@3: width: 40px; rlm@3: position: absolute; rlm@3: background: url(right_arrow.png) no-repeat center center; rlm@3: right: 0px; rlm@3: visibility: hidden; rlm@3: cursor: pointer; rlm@3: } rlm@3: #gallery #images #smallmessage { rlm@3: background-image: url(message-popup.png); rlm@3: background-repeat: no-repeat; rlm@3: background-position: center top; rlm@3: position: absolute; rlm@3: bottom: -85px; rlm@3: height: 76px; rlm@3: width: 205px; rlm@3: text-align: center; rlm@3: padding: 8px 5px 0px; rlm@3: color: #CCC; rlm@3: font-size: 0.8em; rlm@3: } rlm@3: #gallery #images #imageinfo { rlm@3: position: absolute; rlm@3: bottom: -300px; rlm@3: height: 250px; rlm@3: width: 90%; rlm@3: text-align: center; rlm@3: padding: 5px 5px 0px; rlm@3: color: #333; rlm@3: font-size: 0.8em; rlm@3: rlm@3: } rlm@3: #largeimage #lrgloader { rlm@3: overflow: hidden; rlm@3: rlm@3: rlm@3: } rlm@3: #largeimage #lrgwrap { rlm@3: overflow: hidden; rlm@3: border: 1px solid #333; rlm@3: background:#000; rlm@3: } rlm@3: #imageinfo #infoloader { rlm@3: font-size: 1.2em; rlm@3: color: #E1E1E1; rlm@3: text-align: left; rlm@3: margin: 0px; rlm@3: position: releative; rlm@3: } rlm@3: #infoloader h2 { rlm@3: font-size: 1.4em; rlm@3: font-weight: bold; rlm@3: color: #333; rlm@3: margin: 0px; rlm@3: padding: 0px; rlm@3: text-shadow:#000; rlm@3: } rlm@3: #infoloader .copyright { rlm@3: font-size: .8em; rlm@3: } rlm@3: #infoloader .author { rlm@3: font-size: .8em; rlm@3: } rlm@3: .right { rlm@3: float: right; rlm@3: } rlm@3: #fsbox { rlm@3: width: 379px; rlm@3: margin: 0 auto; rlm@3: overflow:hidden; rlm@3: height:300px; rlm@3: z-index: 51; rlm@3: position: absolute; rlm@3: bottom: -350px; rlm@3: left: 200px; rlm@3: color: #FFF; rlm@3: } rlm@3: #fsbox #fsbutton { rlm@3: color: #000; rlm@3: background: url(buybutton.png) no-repeat center bottom; rlm@3: height: 15px; rlm@3: text-align: center; rlm@3: padding: 2px 0 0 0; rlm@3: margin:2px 0 6px; rlm@3: font-size: 0.8em; rlm@3: position: relative; rlm@3: cursor:pointer; rlm@3: } rlm@3: #fsbox #fstop { rlm@3: background: url(buynow_top.png) no-repeat center top; rlm@3: height: 19px; rlm@3: text-align: center; rlm@3: padding: 0; rlm@3: margin:0; rlm@3: } rlm@3: #fsbox #forsale { rlm@3: background-image: url(buynow_middle.png); rlm@3: background-repeat: repeat-y; rlm@3: margin: 0px; rlm@3: padding: 0 15px 20px; rlm@3: position:relative; rlm@3: } rlm@3: #fsbox #forsale img{ rlm@3: padding: 0 10px 10px; rlm@3: rlm@3: } rlm@3: #fsbox hr { rlm@3: clear:both; rlm@3: visibility:hidden; rlm@3: } rlm@3: #fsbox #fsclose{ rlm@3: background-image: url(closebtn.png); rlm@3: background-repeat: no-repeat; rlm@3: background-position: center center; rlm@3: height: 28px; rlm@3: width: 28px; rlm@3: z-index: 220000; rlm@3: cursor:pointer; rlm@3: position: absolute; rlm@3: left: 0px; rlm@3: top: 15px; rlm@3: } rlm@3: #purchasebtn{ rlm@3: font-weight:bold; rlm@3: text-align:center; rlm@3: margin:10px; rlm@3: padding:11px 0 0 5px; rlm@3: position:absolute; rlm@3: right:15px; rlm@3: top:0px; rlm@3: } rlm@3: #gallery #galleries #galleryset { rlm@3: text-align: left; rlm@3: width: 760px; rlm@3: margin: 0 auto; rlm@3: } rlm@3: #thumbnailPopUp{ rlm@3: z-index:1; rlm@3: visibility:hidden; rlm@3: background:url(pop_arrow.png) no-repeat center bottom; rlm@3: padding-bottom:8px; rlm@3: position:absolute; rlm@3: top:0; rlm@3: left:-10000px; rlm@3: } rlm@3: #thumbnailPopUp img{ rlm@3: margin:0; rlm@3: padding:0; rlm@3: background:#333; rlm@3: border:#FFF solid 3px; rlm@3: } rlm@3: .clear{clear:both;}