update
This commit is contained in:
+416
-103
@@ -1,4 +1,5 @@
|
||||
@charset "utf-8";
|
||||
|
||||
/*
|
||||
*
|
||||
* 2nd-CSS-Reset
|
||||
@@ -13,63 +14,115 @@
|
||||
}
|
||||
|
||||
|
||||
#head{
|
||||
#head {
|
||||
clip-path: circle(90% at 25% 160%);
|
||||
}
|
||||
#head>img{
|
||||
|
||||
#head>img {
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
* { padding:0; margin:0}
|
||||
*:focus { outline:none }
|
||||
* {
|
||||
padding: 0;
|
||||
margin: 0
|
||||
}
|
||||
|
||||
html, body { height:100%; width:100%;overflow:hidden;}
|
||||
p,ul,ol { margin-bottom:12px;}
|
||||
*:focus {
|
||||
outline: none
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
p,
|
||||
ul,
|
||||
ol {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding-left: 23px;
|
||||
}
|
||||
|
||||
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;
|
||||
ul.navi {
|
||||
margin: 0;
|
||||
padding: 0
|
||||
}
|
||||
a {color:#fff;text-decoration:underline;}
|
||||
|
||||
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 {}
|
||||
|
||||
a img {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
a:hover,
|
||||
button:hover {}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
.clear {
|
||||
clear:both;
|
||||
height:0;
|
||||
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 {
|
||||
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}
|
||||
|
||||
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');
|
||||
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;
|
||||
|
||||
@@ -79,84 +132,344 @@ body#page_gallery {background:#333}
|
||||
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');
|
||||
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;
|
||||
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;
|
||||
}
|
||||
Reference in New Issue
Block a user