* {padding: 0; margin: 0 auto;} body {text-align: center;} /* STARTSEITE */ #startseite { background: #b32501;} #welcome {width: 900px; height: 645px; position: relative; top: 20px; background: url(../images/start/welcome-bg2.jpg) no-repeat center top; z-index: 1;} #startmenu { position: relative; left: 6px; top: 64px; width: 900px; height: 570px; margin: 0; padding: 0; background: url(../images/start/startmenu.gif) 0px 0px no-repeat; } #startmenu li {margin: 0; padding: 0; list-style: none; display: block; position: absolute;} #startmenu a {display: block; text-indent: -9999px; text-decoration: none;} #startbooks {left: 20px; top: 10px; width: 140px; height: 70px;} #starteditorial {left: 100px; top: 240px; width: 160px; height: 90px;} #startadvertising {left: 700px; top: 115px; width: 170px; height: 90px;} #startsketchbook {left: 24px; top: 390px; width: 170px; height: 90px;} #startcurriculum {left: 615px; top: 295px; width: 170px; height: 90px;} #startcontact {left: 460px; top: 415px; width: 120px; height: 70px;} #startphotos {left: 180px; top: 490px; width: 120px; height: 70px;} #startlessons {left: 630px; top: 450px; width: 160px; height: 90px;} #startbooks a, #startcontact a, #startphotos a {height: 70px;} #starteditorial a, #startadvertising a, #startsketchbook a, #startcurriculum a, #startlessons a {height: 90px;} #startbooks a:hover {display: block; background: url(../images/start/startmenu.gif) -20px -590px no-repeat;} #starteditorial a:hover {display: block; background: url(../images/start/startmenu.gif) -100px -820px no-repeat;} #startadvertising a:hover {display: block; background: url(../images/start/startmenu.gif) -700px -695px no-repeat;} #startsketchbook a:hover {display: block; background: url(../images/start/startmenu.gif) -24px -970px no-repeat;} #startcurriculum a:hover {display: block; background: url(../images/start/startmenu.gif) -615px -875px no-repeat;} #startcontact a:hover {display: block; background: url(../images/start/startmenu.gif) -460px -995px no-repeat;} #startphotos a:hover {display: block; background: url(../images/start/startmenu.gif) -180px -1070px no-repeat;} #startlessons a:hover {display: block; background: url(../images/start/startmenu.gif) -630px -1030px no-repeat;} /* UNTERSEITEN */ /* HAUPTMENU */ #menu { position: relative; width: 800px; height: 120px; } #hauptmenu { position: relative; left: 0; top: 20px; width: 800px; height: 27px; margin: 0; padding: 0; background: url(../images/menu/menu.gif) 0px 0px no-repeat; } #hauptmenu li {margin: 0; padding: 0; list-style: none; display: block; position: absolute;} #hauptmenu a {display: block; text-indent: -9999px; text-decoration: none;} #books {left: 0px; top: 0px; width: 72px; height: 25px;} #editorial {left: 72px; top: 0px; width: 99px; height: 25px;} #advertising {left: 171px; top: 0px; width: 119px; height: 25px;} #sketchbook {left: 290px; top: 0px; width: 114px; height: 25px;} #curriculum {left: 404px; top: 0px; width: 108px; height: 25px;} #contact {left: 512px; top: 0px; width: 89px; height: 25px;} #photos {left: 601px; top: 0px; width: 79px; height: 25px;} #lessons {left: 680px; top: 0px; width: 90px; height: 25px;} #books a, #editorial a, #advertising a, #sketchbook a, #curriculum a, #contact a, #photos a, #lessons a {height: 25px;} #books a:hover, .current#books {display: block; background: url(../images/menu/menu.gif) 0px -26px no-repeat;} #editorial a:hover, .current#editorial {display: block; background: url(../images/menu/menu.gif) -72px -26px no-repeat;} #advertising a:hover, .current#advertising {display: block; background: url(../images/menu/menu.gif) -171px -26px no-repeat;} #sketchbook a:hover, .current#sketchbook {display: block; background: url(../images/menu/menu.gif) -290px -26px no-repeat;} #curriculum a:hover, .current#curriculum {display: block; background: url(../images/menu/menu.gif) -404px -26px no-repeat;} #contact a:hover, .current#contact {display: block; background: url(../images/menu/menu.gif) -512px -26px no-repeat;} #photos a:hover, .current#photos {display: block; background: url(../images/menu/menu.gif) -601px -26px no-repeat;} #lessons a:hover, .current#lessons {display: block; background: url(../images/menu/menu.gif) -680px -26px no-repeat;} #linie {position: relative; top: 20px;} #theworld {position: absolute; width: 360px; top: 585px; left: 380px;} #homemenu { position: absolute; width: 42px; left: 740px; top: 575px; height: 48px; margin: 0; padding: 0; background: url(../images/menu/pfeil2.gif) 0px 0px no-repeat; } #homemenu li {margin: 0; padding: 0; list-style: none; display: block; position: absolute;} #homemenu a {display: block; text-indent: -9999px; text-decoration: none;} #pfeil {left: 0px; top: 0px; width: 42px; height: 48px;} #pfeil a {height: 48px;} #pfeil a:hover {display: block; background: url(../images/menu/pfeil2.gif) 0px -49px no-repeat;} /* CURRICULUM | CONTACT | MUSICIAN */ #content {position: relative; top: 20px;} #linkeseite {width: 288px; padding-right: 20px; float: left;} #inhalt {position: relative; top: 20px; font-family: Lucida Sans Unicode, Lucida Grande, sans-serif; color: #000; font-size: 11px; line-height: 15px; overflow: auto; height: 480px; padding-right: 20px; text-align: left;} h1 {font-size: 13px; color: #000;} h2 {font-size: 13px; color: #000; font-weight: bold;} h3 {font-size: 11px; color: #000; font-weight: bold;} .impressum {font-size: 9px; color: #000;} #inhalt li {margin-left: 20px;} b {line-height: 24px;} /* GALLERY */ /* ================================================================ 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. =================================================================== */ #gallery {width: 760px; height: 500px; position: relative; top: 30px; border: 0 none; background: #fff;} #gallery ul {list-style: none; padding: 5px; margin: 0; width: 195px; float: left; height: 506px; overflow: hidden;} #gallery ul li {display: inline; width: 50px; height: 50px; float: left; margin: 0 9px 9px 0; border: 1px solid #fff; background: #ccc; cursor: pointer;} #gallery ul li img {display: block; width: 50px; height: 50px;} #gallery ul li object {display: none;} #gallery ul li span {display: none; position: absolute; left: 220px; top: 456px; width: 520px; font-family: Lucida Sans Unicode, Lucida Grande, sans-serif; color: #000; font-size: 11px; line-height: 15px; text-align: left;} #gallery ul li span b {color: #444;} /* required for IE5.x and IE6 to display the start image size correctly */ #gallery ul li.click i img.default-ad {margin: 6px auto 0 auto; width: 363px; height: 436px; float: left;} #gallery ul li.click i img.default-bo {margin: 6px auto 0 auto; width: 351px; height: 436px; float: left;} #gallery ul li.click i img.default-ed {margin: 6px auto 0 auto; width: 325px; height: 436px; float: left;} #gallery ul li.click i img.default-ga {margin: 6px auto 0 auto; width: 520px; height: 259px; float: left;} #gallery ul li.click i img.default-ph {margin: 6px auto 0 auto; width: 520px; height: 290px; float: left;} #gallery ul li.off {display: none;} #gallery ul li.click {border-color: #f00; background: #fff; cursor: default;} #gallery ul li.click i {position: absolute; left: 220px; top: 0; width: 520px; height: 436px;} #gallery ul li.click i object {display: block; position: absolute; left: 0px; top: 6px; width: 436px; height: 436px;} #gallery ul li.click i img {margin: 6px auto 0 auto; width: auto; height: auto; float: left;} #gallery ul li.click span {display: block;}