@charset "UTF-8";
body,html,h1,h2,h3,h4,h5,h6,p,ul,ol,li{padding:0;margin:0;}body,html{width:100%;height:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}a{outline:none !important;text-decoration:none;}ol,ul,li{list-style:none;}.clear{clear:both;line-height:0;font-size:0;height:0;width:0;overflow:hidden;visibility:hidden;display:block;}p{cursor:text;}b,strong{font-weight:bold;}img{-ms-interpolation-mode:bicubic;}li{display:list-item;}.clearfix:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0;}.clearfix{display:inline-block;}* html .clearfix{height:1%;}.clearfix{display:block;}.nowrap{font-style:normal;white-space:nowrap;}

/* ########## General ########## */
body{background:#eee7e8;font-family:'Open Sans',sans-serif;font-size:18px;line-height:160%;color:#675459;overflow-x:hidden;}
body.overflow-hidden{overflow:hidden;}
::selection{background-color:#996b39;color:#fff;}::-moz-selection{background-color:#996b39;color:#fff;}
#root{padding:70px;max-width:1600px;margin:auto;}
.wrapper{width:90%;max-width:1100px;margin:auto;position:relative;}
:target:before{content:"";display:block;height:170px;margin:-170px 0 0;}
.covervid-wrapper{position:absolute;top:0;left:0;width:100%;height:100%;}
/* Responsive */
@media only screen and (max-width: 1600px){
	body{font-size:16px;}
	#root{padding:50px;}
}
@media only screen and (max-width: 1000px){
	body{font-size:14px;}
	#root{padding:0;}
}

/* ########## Loading ########## */
#loading{position:fixed;top:0;left:0;right:0;bottom:0;z-index:11;background:#32342f;color:#eee;}
#loading p{position:absolute;top:50%;left:0;right:0;text-align:center;font-size:20px;font-weight:600;text-transform:uppercase;-webkit-transform:translateY(-50%);transform:translateY(-50%);-webkit-animation:loading 3s infinite;animation:loading 3s infinite;}
#loading p span{display:block;font-size:15px;color:rgba(255,255,255,0.5);margin:5px 0 0 0;}
@-webkit-keyframes loading{0%,100%{opacity:1}50%{opacity:0.3}}
@keyframes loading{0%,100%{opacity:1}50%{opacity:0.3}}

/* ########## Stage ########## */
#stage{height:1000px;max-height:calc(100vh - 50px);box-sizing:border-box;position:relative;background:url(../content/restaurant-neuwerk.jpg) no-repeat center !important;background-size:cover !important;}
#stage .logo{display:none;position:absolute;top:10%;left:50%;width:20%;-webkit-transform:translateX(-50%);transform:translateX(-50%);}
#stage .typo{display:none;position:absolute;top:35%;left:0;right:0;text-align:center;color:#fff;font-weight:400;}
#stage .typo p{margin:0;font-size:110px;font-family:'Italianno',cursive;line-height:80%;font-weight:400;}
#stage .typo span{display:block;font-size:30px;margin:50px 0 0 0;color:rgba(255,255,255,0.5);}
#stage .more{position:absolute;left:50%;bottom:30px;width:80px;height:50px;background:url(../assets/more.png);-webkit-transform:translateX(-50%);transform:translateX(-50%);cursor:pointer;opacity:0.5;-webkit-animation:more 3s infinite;animation:more 3s infinite;-webkit-transition:opacity .3s;transition:opacity .3s;}
#stage .more:hover{opacity:1;}
#call{display:none;background:#996b39;color:#fff;font-size:20px;font-weight:600;padding:15px 0;text-align:center;}
@-webkit-keyframes more{0%,100%{bottom:30px;}50%{bottom:20px;}}
@keyframes more{0%,100%{bottom:30px;}50%{bottom:20px;}}
/* Responsive */
@media only screen and (max-width: 1600px){
	#stage{height:60vw;}
	#stage .logo{width:25%;}
	#stage .typo p{font-size:7vw;}
	#stage .typo span{font-size:18px;margin-top:30px;}
}
@media only screen and (max-width: 1000px){
	#stage{height:500px;-webkit-transform:none !important;transform:none !important;}
	#stage .logo{width:35%;}
	#stage .typo p{font-size:7vw;}
}
@media only screen and (max-width: 500px){
	#stage{height:380px;}
	#stage .logo{width:60%;top:17%;}
	#stage .typo{top:auto;bottom:40%;}
	#stage .typo p{font-size:12vw;}
	#stage .typo span{display:none;}
	#call{display:block;}
	#stage .more{display:none;}
}
@media only screen and (max-width: 420px){
	#stage .logo{top:20%;}
	#stage .typo{bottom:50%;}
}

/* ########## Welcome ########## */
#welcome{position:relative;z-index:5;background:#eee7e8;}
#welcome .img{position:absolute;top:0;right:0;left:50%;bottom:0;width:50%;}
#welcome .img img{width:100%;height:auto;display:none;}
#welcome .text{padding:150px;width:50%;box-sizing:border-box;}
#welcome .text p{margin:0;}
/* Responsive */
@media only screen and (max-width: 1600px){
	#welcome .text{padding:100px;}
}
@media only screen and (max-width: 1000px){
	#welcome .text{padding:50px 5%;}
}
@media only screen and (min-width: 801px){
	#welcome .img{background:url(../content/neuzeit-neuwerk.jpg) no-repeat center;background-size:cover;}
}
@media only screen and (max-width: 800px){
	#welcome .img{display:none;}
	#welcome .text{width:100%;padding:50px 5%;}
}

/* ########## Images / Banner ########## */
.images{position:relative;z-index:2;}
.images.dark{background:#32342f;}
.images.red{background:#996b39;}
.images img{display:block;width:25%;}
.images.left img{float:left;}
.images.right img{float:right;}
.banner img{display:block;width:100%;height:auto;}
/* Responsive */
@media only screen and (max-width: 600px){
	.images img{width:50%;}
}

/* ########## Über uns ########## */
#ueber-uns{padding:150px;background:#32342f;color:#eee;}
/* Responsive */
@media only screen and (max-width: 1600px){
	#ueber-uns{padding:100px;}
}
@media only screen and (max-width: 1000px){
	#ueber-uns{padding:70px 5% 50px;}
}

/* ########## Location ########## */
#location{padding:150px;}
/* Responsive */
@media only screen and (max-width: 1600px){
	#location{padding:100px;}
}
@media only screen and (max-width: 1000px){
	#location{padding:70px 5% 50px;}
}

/* ########## Über uns ########## */
#delivery{padding:150px;background:#32342f;color:#eee;text-align:center;}
#delivery a{display:inline-block;padding:12px 20px;color:#fff;background:#996b39;}
#delivery h1 span{margin-bottom:40px;}
/* Responsive */
@media only screen and (max-width: 1600px){
	#delivery{padding:100px;}
}
@media only screen and (max-width: 1000px){
	#delivery{padding:70px 5% 50px;}
}

/* ########## Speisekarte ########## */
#speisekarte{position:relative;}
#speisekarte .img{position:absolute;top:0;left:0;right:50%;bottom:0;background:url(../content/speisekarte.jpg) no-repeat center;background-size:cover;}
#speisekarte .text{float:right;width:50%;padding:100px;box-sizing:border-box;}
#speisekarte .text h1{text-align:left;}
#speisekarte .text h1 span{margin-bottom:30px;}
/* Modal */
#speisekarte-modal{display:none;position:fixed;z-index:10;top:0;left:0;right:0;bottom:0;}
#speisekarte-modal .close{position:absolute;z-index:999;top:20px;right:20px;background:#fff;border-radius:10px;padding:8px 12px;text-transform:uppercase;font-weight:bold;cursor:pointer;}
#speisekarte-modal .overlay{position:absolute;z-index:1;top:0;left:0;right:0;bottom:0;background:rgba(20,20,20,0.8);cursor:pointer;}
#speisekarte-modal .inner{position:absolute;z-index:2;top:70px;left:50%;bottom:70px;width:80%;max-width:1400px;padding:100px;box-sizing:border-box;border-radius:5px;background:#eee7e8;-webkit-transform:translateX(-50%);transform:translateX(-50%);overflow-y:scroll;-webkit-overflow-scrolling:touch;}
#speisekarte-modal .inner strong{display:block;color:#996b39;}
#speisekarte-modal .inner :not(h1) span{display:block;font-size:14px;}
#speisekarte-modal .inner .banner{margin-top:-30px;}
/* Responsive */
@media only screen and (max-width: 1600px){
	#speisekarte-modal .inner{padding:70px 5%;}
}
@media only screen and (max-width: 700px){
	#speisekarte{padding-bottom:400px;}
	#speisekarte .text{float:none;width:100%;padding:50px 5%;}
	#speisekarte .img{top:auto;right:0;height:400px;}
	#speisekarte-modal .inner{top:0;bottom:0;left:0;width:100%;border-radius:0;-webkit-transform:none;transform:none;padding:100px 3% 50px;}
	#speisekarte-modal .inner .banner{margin-top:0;}
}
@media only screen and (max-width: 550px){
	#speisekarte{padding-bottom:350px;}
	#speisekarte .img{height:350px;}
}

/* ########## Video ########## */
#video{position:relative;background:url(../content/banner-02.jpg) no-repeat center;background-size:cover;}
#video .inner{position:relative;z-index:2;padding:250px 0;}
#video .inner h1{color:#fff;}
#video .inner h1 span{margin-bottom:0;margin-top:50px;color:rgba(255,255,255,0.7);}
#video .inner a{color:#fff;}
/* Responsive */
@media only screen and (min-width: 1000px){
	#video .inner h1{color:#fff;font-size:100px;}
}

/* ########## Kontakt ########## */
#kontakt{padding:150px;background:#32342f;color:#eee;overflow:hidden;}
#kontakt a{display:inline-block;margin:20px 0 0 0;font-size:14px;color:#777;}
#maps{width:100%;height:450px;}
img.parking{display:block;width:100%;height:auto;margin-top:30px;}
#kontakt .disabled img{display:inline-block;width:20px;height:auto;margin:0 10px -5px 0;}
/* Imprint */
#imprint{display:none;position:fixed;z-index:10;top:0;left:0;right:0;bottom:0;}
#imprint .close{position:absolute;z-index:999;top:20px;right:20px;background:#fff;border-radius:10px;padding:8px 12px;text-transform:uppercase;font-weight:bold;cursor:pointer;}
#imprint .overlay{position:absolute;z-index:1;top:0;left:0;right:0;bottom:0;background:rgba(20,20,20,0.8);cursor:pointer;}
#imprint .inner{position:absolute;z-index:2;top:70px;left:50%;bottom:70px;width:80%;max-width:1400px;padding:100px;box-sizing:border-box;border-radius:5px;background:#eee7e8;-webkit-transform:translateX(-50%);transform:translateX(-50%);overflow-y:scroll;-webkit-overflow-scrolling:touch;}
/* Responsive */
@media only screen and (max-width: 1600px){
	#kontakt{padding:100px;}
}
@media only screen and (max-width: 1000px){
	#kontakt{padding:70px 5% 50px;}
}
@media only screen and (max-width: 800px){
	#kontakt .col{width:100%;}
}
@media only screen and (max-width: 700px){
	#imprint .inner{top:0;bottom:0;left:0;width:100%;border-radius:0;-webkit-transform:none;transform:none;padding:50px 3%;}
	img.parking{width:250%;margin-left:-85%;}
	#kontakt{padding-bottom:0;}
}

/* ########## Typography ########## */
h1{text-align:center;color:#996b39;font-family:'Italianno',cursive;font-size:90px;font-weight:400;}
h1 span{display:block;color:#717670;font-family:'Open Sans',sans-serif;font-size:30px;line-height:140%;font-weight:400;margin:20px 0 100px;}
h2{text-align:center;font-family:'Italianno',cursive;font-size:50px;font-weight:700;margin:130px 0 80px;}
p{margin:0 0 35px 0;}
a{color:#996b39;}
a.button{color:#996b39;display:inline-block;border:1px solid #996b39;padding:8px 12px;margin:30px 0 0 0;border-radius:3px;-webkit-transition:all .2s;transition:all .2s;}
a.button:hover{background:#996b39;color:#fff;}
/* Cols */
.col{float:left;position:relative;}
.cols-5050 .col{width:47.5%;}
.cols-5050 .col:first-child, .cols-3070 .col:first-child{padding-right:5%;}
.cols-3070 .col:first-child{width:30%;}
.cols-3070 .col:last-child{width:65%;}
/* Responsive */
@media only screen and (max-width: 1600px){
	h1{font-size:70px;}
	h1 span{font-size:25px;margin:20px 0 80px;}
	p{margin:0 0 25px 0;}
}
@media only screen and (max-width: 1000px){
	h1{font-size:50px;}
	h1 span{font-size:20px;margin:15px 0 50px;}
}
@media only screen and (max-width: 800px){
	h1 span{margin:10px 0 30px;}
	.cols-5050 .col, .cols-3070 .col{width:100%;}
	h2{margin-top:80px;}
}

#buttons{position:fixed;left:50%;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);z-index:10;margin-left:850px;}
#buttons li{margin-bottom:5px;}
#buttons li a{display:block;width:40px;height:40px;padding:1px;background:#fff;text-align:center;-webkit-transition:background .2s ease-in-out;transition:background .2s ease-in-out;font-weight:bold;line-height:40px;border-radius:50%;}
#buttons li a:hover{background:#f5f5f5;}
#buttons li a svg{display:block;width:30px;height:30px;margin:5px;}
/* Responsive */
@media only screen and (max-width: 1800px){
	#buttons{right:10px;margin:0;left:auto;}
}
@media only screen and (max-width: 1600px){
	#buttons{right:7px;}
	#buttons li a{width:30px;height:30px;line-height:30px;}
	#buttons li a svg{width:20px;height:20px;}
}
@media only screen and (max-width: 1000px){
	#buttons{top:20px;-webkit-transform:none;transform:none;}
}










