* { margin: 0; padding: 0 } body { background: #fff } a { outline: none } #content { background: #fff url(../gfx/h1.gif) no-repeat 70px 70px; border: 1px solid #ddd; height: 530px; margin: 0 auto; padding: 70px; position: relative; width: 820px } #content:after { content: "."; display: block; height: 0; clear: both; visibility: hidden } h1 { height: 0; text-indent: -9999px } #content #wrap { position: absolute; right: 100px; top: 70px } #home #content { height: 480px; padding: 0; width: 480px } #home a { background: #fff url(../gfx/welcome.gif) no-repeat; display: block; height: 480px; margin: -100px 0 0 -140px; text-indent: -9999px; width: 480px } #home a:hover { background: #fff url(../gfx/welcome.gif) no-repeat -480px 0 } #content ul#photos { bottom: 70px; position: absolute; right: 70px; width: 480px } #content ul#photos li#one a.selected { background-position: 0 -10px !important } #content ul#photos a { float: left; text-indent: -9999px } #content ul#photos li { float: left; list-style: none } #content ul#photos li a { background: url(../gfx/nr.gif) no-repeat; display: block; height: 10px; width: 15px } #content ul#photos li#one a { background-position: 0 0; width: 9px } #content ul#photos li#one a:hover, #content ul#photos li#one a.selected { background-position: 0 -10px } #content ul#photos li#two a { background-position: -9px 0 } #content ul#photos li#two a:hover, #content ul#photos li#two a.selected { background-position: -9px -10px } #content ul#photos li#three a { background-position: -23px 0 } #content ul#photos li#three a:hover, #content ul#photos li#three a.selected { background-position: -23px -10px } #content ul#photos li#four a { background-position: -38px 0 } #content ul#photos li#four a:hover, #content ul#photos li#four a.selected { background-position: -38px -10px } #content ul#photos li#five a { background-position: -53px 0 } #content ul#photos li#five a:hover, #content ul#photos li#five a.selected { background-position: -53px -10px } #content ul#photos li#six a { background-position: -68px 0 } #content ul#photos li#six a:hover, #content ul#photos li#six a.selected { background-position: -68px -10px } #content ul#photos li#seven a { background-position: -82px 0 } #content ul#photos li#seven a:hover, #content ul#photos li#seven a.selected { background-position: -82px -10px } #content ul#photos li#eight a { background-position: -97px 0 } #content ul#photos li#eight a:hover, #content ul#photos li#eight a.selected { background-position: -97px -10px } #content ul#photos li#nine a { background-position: -111px 0 } #content ul#photos li#nine a:hover, #content ul#photos li#nine a.selected { background-position: -111px -10px } #content ul#photos li#ten a { background-position: -126px 0; width: 21px } #content ul#photos li#ten a:hover, #content ul#photos li#ten a.selected { background-position: -126px -10px } #content ul#photos li#eleven a { background-position: -146px 0; width: 21px } #content ul#photos li#eleven a:hover, #content ul#photos li#eleven a.selected { background-position: -146px -10px } #content ul#photos li#twelve a { background-position: -166px 0; width: 21px } #content ul#photos li#twelve a:hover, #content ul#photos li#twelve a.selected { background-position: -166px -10px } #content ul#photos li#thirteen a { background-position: -188px 0; width: 21px } #content ul#photos li#thirteen a:hover, #content ul#photos li#thirteen a.selected { background-position: -188px -10px } #content ul#photos li#fourteen a { background-position: -209px 0; width: 21px } #content ul#photos li#fourteen a:hover, #content ul#photos li#fourteen a.selected { background-position: -209px -10px } #content ul#photos li#fifteen a { background-position: -231px 0; width: 21px } #content ul#photos li#fifteen a:hover, #content ul#photos li#fifteen a.selected { background-position: -231px -10px } #content ul#photos li#sixteen a { background-position: -253px 0; width: 21px } #content ul#photos li#sixteen a:hover, #content ul#photos li#sixteen a.selected { background-position: -253px -10px } #content ul#photos li#seventeen a { background-position: -274px 0; width: 21px } #content ul#photos li#seventeen a:hover, #content ul#photos li#seventeen a.selected { background-position: -274px -10px } #content ul#photos li#eighteen a { background-position: -295px 0; width: 21px } #content ul#photos li#eighteen a:hover, #content ul#photos li#eighteen a.selected { background-position: -295px -10px } #content ul#photos li#nineteen a { background-position: -316px 0; width: 22px } #content ul#photos li#nineteen a:hover, #content ul#photos li#nineteen a.selected { background-position: -316px -10px } #content ul#photos li#twenty a { background-position: -339px 0; width: 24px } #content ul#photos li#twenty a:hover, #content ul#photos li#twenty a.selected { background-position: -339px -10px } #content ul#photos li#twentyone a { background-position: -363px 0; width: 21px } #content ul#photos li#twentyone a:hover, #content ul#photos li#twentyone a.selected { background-position: -363px -10px } #content ul#photos li#twentytwo a { background-position: -384px 0; width: 25px } #content ul#photos li#twentytwo a:hover, #content ul#photos li#twentytwo a.selected { background-position: -384px -10px } #content ul#photos li#twentythree a { background-position: -409px 0; width: 24px } #content ul#photos li#twentythree a:hover, #content ul#photos li#twentythree a.selected { background-position: -409px -10px } #content ul#photos li#twentyfour a { background-position: -433px 0; width: 24px } #content ul#photos li#twentyfour a:hover, #content ul#photos li#twentyfour a.selected { background-position: -433px -10px } #content ul#photos li#twentyfive a { background-position: -457px 0; width: 21px } #content ul#photos li#twentyfive a:hover, #content ul#photos li#twentyfive a.selected { background-position: -457px -10px } #content p#menu a { background: url(../gfx/menu.gif) no-repeat; bottom: 70px; display: block; height: 9px; left: 70px; position: absolute; text-indent: -9999px; width: 39px } #content ul#items { bottom: 99px; left: 70px; height: 68px; list-style: none; position: absolute; text-indent: -9999px; } #content ul#items li { height: 10px !important; display: inline; width: 72px; /*border: 1px solid red*/ } #content ul#items li a { display: block; height: 10px;margin: 0 0 4px 0; width: 72px } #content ul#items li#gallery-one a { background: url(../gfx/menu-items.gif) no-repeat } #content ul#items li#gallery-one a:hover, #content ul#items li#gallery-one a.current { background: url(../gfx/menu-items.gif) -76px 0px no-repeat } #content ul#items li#gallery-two a { background: url(../gfx/menu-items.gif) 0 -14px no-repeat } #content ul#items li#gallery-two a:hover, #content ul#items li#gallery-two a.current { background: url(../gfx/menu-items.gif) -76px -14px no-repeat } #content ul#items li#gallery-three a { background: url(../gfx/menu-items.gif) 0 -28px no-repeat } #content ul#items li#gallery-three a:hover, #content ul#items li#gallery-three a.current { background: url(../gfx/menu-items.gif) -76px -28px no-repeat } #content ul#items li#gallery-four a { background: url(../gfx/menu-items.gif) 0 -42px no-repeat } #content ul#items li#gallery-four a:hover, #content ul#items li#gallery-four a.current { background: url(../gfx/menu-items.gif) -76px -42px no-repeat } #content ul#items li#gallery-five a { background: url(../gfx/menu-items.gif) 0 -56px no-repeat } #content ul#items li#gallery-five a:hover, #content ul#items li#gallery-five a.current { background: url(../gfx/menu-items.gif) -76px -56px no-repeat } #content ul#items li#contact-page a { background: url(../gfx/menu-items.gif) 0 -70px no-repeat } #content ul#items li#contact-page a:hover, #content ul#items li#contact-page a.current { background: url(../gfx/menu-items.gif) -76px -70px no-repeat } #contact p#contact-mail a { float: right; text-indent: -9999px; width: 480px; background: url(../gfx/contact-info.gif) no-repeat; height: 12px; display: block } #contact p#contact-mail a:hover { float: right; text-indent: -9999px; width: 480px; background: url(../gfx/contact-info.gif) 0 -33px no-repeat; height: 12px; display: block } #contact p#contact-phone { float: right; text-indent: -9999px; width: 480px; background: url(../gfx/contact-info.gif) 0 -12px no-repeat; height: 12px; display: block } #wrap { width: 450px; height: 510px; } .loading { background: url( '../gfx/loadingIcon.gif' ) no-repeat 50% 50%; }