body {
background-color : #FEF2ED;
margin : 0;
font-family : Verdana;
font-size : 10pt;
}
a {
border : 0;
}
#back {
background-image : url('../images/BG-1.jpg');
position : absolute;
top : 50%;
margin-top : -230px;
left : 50%;
margin-left : -320px;
width : 640px;
height : 460px;
}
#lines {
position : absolute;
top : 0;
left : 0;
background-image : url('../images/BG-2.png');
width : 640px;
height : 460px;
}
#logo {
position : absolute;
top : 27px;
left : 117px;
background-image : url('../images/BG-Logo.jpg');
width : 402px;
height : 208px;
}
#menu {
position : absolute;
bottom : 0;
left : 0;
height : 33px;
width : 640px;
}
#menu a#philosophie {
position : absolute;
left : 0;
height : 33px;
width : 115px;
background-image : url('../images/menu.png');
background-position : 0 0;
}
#menu a#philosophie:hover, #menu a#philosophie.hover {
background-position : 0 33px;
}
#menu a#kontact {
position : absolute;
left : 117px;
height : 33px;
width : 96px;
background-image : url('../images/menu.png');
background-position : -120px 0;
}
#menu a#kontact:hover, #menu a#kontact.hover {
background-position : -120px 33px;
}
#menu a#karte {
position : absolute;
left : 516px;
height : 33px;
width : 127px;
background-image : url('../images/menu.png');
background-position : -513px 0;
}
#menu a#karte:hover, #menu a#karte.hover {
background-position : -513px 32px;
}
#menu a#produkte {
position : absolute;
left : 222px;
height : 33px;
width : 116px;
background-image : url('../images/menu.png');
background-position : -225px 0;
}
#menu a#produkte:hover, #menu a#produkte.hover {
background-position : -225px 33px;
}
#menu a#laden {
position : absolute;
left : 345px;
height : 33px;
width : 120px;
background-image : url('../images/menu.png');
background-position : -347px 0;
}
#menu a#laden:hover, #menu a#laden.hover {
background-position : -347px 33px;
}
#menu a#news {
position : absolute;
left : 469px;
height : 33px;
width : 37px;
background-image : url('../images/menu.png');
background-position : -469px 0;
}
#menu a#news:hover, #menu a#news.hover {
background-position : -469px 33px;
}
#icons a#i-philosophie {
position : absolute;
top : 183px;
left : 22px;
height : 80px;
width : 110px;
background-image : url('../images/i-philosophie.png');
background-position : 0 0;
}
#icons a#i-philosophie:hover, #icons a#i-philosophie.hover {
background-position : 0 80px;
}
#icons a#i-kontact {
position : absolute;
top : 290px;
left : 51px;
height : 117px;
width : 105px;
background-image : url('../images/i-kontakt.jpg');
background-position : 0 0;
}
#icons a#i-kontact:hover, #icons a#i-kontact.hover {
background-position : 0 117px;
}
#icons a#i-karte {
display: none;
position : absolute;
top : 287px;
left : 193px;
height : 75px;
width : 117px;
background-image : url('../images/i-karte.jpg');
background-position : 0 0;
}
#icons a#i-karte:hover, #icons a#i-karte.hover {
background-position : 0 75px;
}
#icons a#i-produkte {
position : absolute;
top : 280px;
left : 266px;
height : 97px;
width : 108px;
background-image : url('../images/i-produkte.png');
background-position : 0 0;
}
#icons a#i-produkte:hover, #icons a#i-produkte.hover {
background-position : 0 97px;
}
#icons a#i-laden {
position : absolute;
top : 295px;
left : 470px;
height : 109px;
width : 115px;
background-image : url('../images/i-laden.png');
background-position : 0 0;
}
#icons a#i-laden:hover, #icons a#i-laden.hover {
background-position : 0 109px;
}
#icons a#i-news {
position : absolute;
top : 182px;
left : 493px;
height : 98px;
width : 114px;
background-image : url('../images/i-news.png');
background-position : 0 0;
}
#icons a#i-news:hover, #icons a#i-news.hover {
background-position : 0 98px;
}
#ajaxpage {
position : absolute;
top : 0;
left : 0;
width : 640px;
height : 460px;
}

/* ------------------------------------------------------------------- */

<style type="text/css">

#homepage a{
  overflow: hidden;
  position: absolute;
  width: 0;
  height: 0;
  left: 0;
  top: 0;
  opacity: 0;
  background: rgba(0, 0, 0, 0.75);
  -moz-transition: opacity 1.5s;
  -o-transition: opacity 1.5s;
  -webkit-transition: opacity 1.5s;
}

#homepage a:target {
  width: 100%;
  height: 100%;
  opacity: 1;
}

#homepage a:target a {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -315px 0 0 -415px;
  border: 15px solid #fff;
  -moz-box-shadow:0 1px 8px #000000;
  -o-box-shadow:0 1px 8px #000000;
  -webkit-box-shadow:0 1px 8px #000000;
}