@charset "utf-8"; /* * * 2nd-CSS-Reset * Last-Update: 29.03.2011 * */ #gallery_nav>li>a>img { width: 100px; height: 100px; object-fit: cover; border-radius: 50%; } #head { clip-path: circle(90% at 25% 160%); } #head>img { height: 150px; } * { padding: 0; margin: 0 } *:focus { outline: none } html, body { height: 100%; width: 100%; overflow: hidden; } p, ul, ol { margin-bottom: 12px; } ul { padding-left: 23px; } ul li {} ul.navi { margin: 0; padding: 0 } ul.navi li { float: left; list-style: none; } ol { padding-left: 23px; } ol li {} a, button, img { -webkit-transition: color .13s ease-in-out, border-color .13s ease-in-out, background-color .13s ease-in-out, opacity .15s ease-in-out; -o-transition: color .13s ease-in-out, border-color .13s ease-in-out, background-color .13s ease-in-out, opacity .15s ease-in-out; -moz-transition: color .13s ease-in-out, border-color .13s ease-in-out, background-color .13s ease-in-out, opacity .15s ease-in-out; transition: color .13s ease-in-out, border-color .13s ease-in-out, background-color .13s ease-in-out, opacity .15s ease-in-out; } a { color: #fff; text-decoration: underline; } a:hover {} a img { border: 0; } a:hover, button:hover {} table { border-collapse: collapse; border-spacing: 0; } .clear { clear: both; height: 0; font-size: 1px; line-height: 0px; } body { overflow: hidden; font-family: 'Galatia', Georgia, 'Times New Roman', Arial; color: #fff; font-size: 17px; } body#page_start {} body#page_restaurant {} body#page_gallery { background: #333 } @font-face { font-family: 'Bentham'; src: url('../font/bentham-webfont.eot'); src: url('../font/bentham-webfont.eot%3F') format('embedded-opentype'), url('../font/bentham-webfont.woff') format('woff'), url('../font/bentham-webfont.ttf') format('truetype'), url('../font/bentham-webfont.svg') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Galatia'; src: url('../font/galsilr-webfont.eot'); src: url('../font/galsilr-webfont.eot%3F') format('embedded-opentype'), url('../font/galsilr-webfont.woff') format('woff'), url('../font/galsilr-webfont.ttf') format('truetype'), url('../font/galsilr-webfont.svg') format('svg'); font-weight: normal; font-style: normal; } div#overlay { background: url(../gfx/bg_overlay.png) center; width: 100%; height: 100%; position: absolute; z-index: 1; top: 0; left: 0; } ul#nav { width: 242px; height: 691px; position: absolute; top: 50%; left: -230px; ; margin-top: -533px; background: url(../gfx/bg_nav.png) no-repeat top left; z-index: 2; padding: 339px 0 0 410px; list-style-type: none; } #page_gallery ul#nav { width: 223px; height: 446px; position: absolute; top: 50%; left: 0px; ; margin-top: -330px; background: url(../gfx/bg_nav_gallery.png) no-repeat top left; padding: 215px 0 0 30px; list-style-type: none; } ul#nav li { margin-bottom: 20px; } ul#nav li a { background: url(../gfx/bg_nav_li.png) no-repeat top left; display: block; width: 80px; height: 80px; } ul#nav li#home a { background-position: 0 0; } ul#nav li#home a:hover { background-position: -80px 0; } ul#nav li#restaurant a { background-position: 0 -80px; } ul#nav li#restaurant a:hover { background-position: -80px -80px; } ul#nav li#gallery a { background-position: 0 -160px; } ul#nav li#gallery a:hover { background-position: -80px -160px; } div#content_wrap { width: 647px; height: 997px; position: absolute; top: 50%; left: 422px; margin-top: -500px; background: url(../gfx/bg_content.png) no-repeat top left; z-index: 3; overflow: hidden; } div#content { width: 647px; height: 782px; padding: 215px 0 0 0; position: relative; } #page_restaurant div#content { width: 647px; height: 870px; padding: 127px 0 0 0; position: relative; } #page_restaurant div#content #head { margin-top: 30px; } div#content ul#sidebar { list-style-type: none; float: right; width: 150px; padding: 0; font-size: 19px; margin: 0 45px 0 0; } div#content ul#sidebar li { background: url(../gfx/bg_sidebar_dot.png) no-repeat left -296px; padding: 0 0 25px 20px } div#content ul#sidebar li a { color: #fff; text-decoration: none; } div#content ul#sidebar li a:hover { color: #fff } div#content ul#sidebar li.first { background-position: left 6px; } div#content ul#sidebar li.last { background-position: left -658px; } div#content ul#sidebar li:hover { background-position: left -477px; } div#content ul#sidebar li.first:hover { background-position: left -115px; } div#content ul#sidebar li.last:hover { background-position: left -779px; } div#content ul#sidebar li.active { cursor: pointer; background-position: left -477px; } div#content ul#sidebar li.first.active { background-position: left -115px; } div#content ul#sidebar li.last.active { background-position: left -779px; } div#content a#logo_1894 { display: block; width: 245px; height: 150px; background: url(../gfx/logo_1894.png) no-repeat top left; } #page_restaurant div#content a#logo_1894 { width: 161px; height: 99px; background: url(../gfx/logo_1894_small.png) no-repeat top left; } div#content a#logo_theater { display: block; width: 166px; height: 70px; background: url(../gfx/logo_theater_erfurt.png) no-repeat top left; position: absolute; bottom: 52px; left: 82px; } div#content h1 { font-family: 'Bentham', Georgia, 'Times New Roman', Arial; color: #fff; font-size: 72px; font-weight: lighter; letter-spacing: 1px; border-top: 1px solid #fff; width: 558px; margin: 20px 0 0 -4px; padding: 20px 0 0 0; } #page_restaurant div#content h1 { border: none; } div#content div#maincontent { width: 440px; line-height: 130%; height: 325px; overflow: auto; } div#content div#maincontent.jspScrollable { width: 470px; position: relative; left: -30px; } div#content div#maincontent h2 { font-family: 'Galatia', Georgia, 'Times New Roman', Arial; color: #fff; font-size: 24px; font-weight: lighter; letter-spacing: 1px; margin-bottom: 15px; } ul#service { list-style-type: none; position: absolute; bottom: 30px; right: 30px; z-index: 4; } ul#service li { float: right; } ul#service li a { font-size: 17px; color: #fff; margin-left: 20px; } ul#service li a:hover { text-decoration: underline } div#gallery_scroll { width: 120px; position: relative; overflow: hidden; z-index: 5; float: right; margin: 110px 50px 0 0; } ul#gallery_nav { width: 120px; height: 100000px; ; list-style-type: none; padding: 0; position: absolute; } ul#gallery_nav li { margin-bottom: 20px; } ul#gallery_nav li a { display: block; width: 100px; height: 100px; background: url(../gfx/bg_gallery_thumb.png) no-repeat left -120px; padding: 10px; } ul#gallery_nav li a:hover, ul#gallery_nav li a.active { background-position: left 0; } .gallery_wrap { width: 100%; height: 100%; position: absolute; z-index: 0; top: 0; background-size: cover !important; } .gallery_wrap img { position: absolute; } #gallery_prev { width: 69px; height: 37px; background: url(../gfx/btn_gallery.png) no-repeat left top; position: absolute; top: 55px; right: 77px; z-index: 1001; } #gallery_prev:hover { background-position: -69px top; cursor: pointer; } #gallery_next { width: 69px; height: 37px; background: url(../gfx/btn_gallery.png) no-repeat left -37px; position: absolute; bottom: 55px; right: 77px; z-index: 1001; } #gallery_next:hover { background-position: -69px -37px; cursor: pointer; } #gallery_scroll * { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } h2 { margin-top: 20px; }