html {
  scroll-behavior: smooth;
 }

body {
  margin: 0;
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  font-weight: 200;
  line-height: 1.5;
  color: #1a1a1a;
  text-align: left;
  background-color: #f0efec;
  -webkit-font-smoothing: antialiased;
  /* width: auto;
  height: 100vh; */
  /*text-rendering: optimizeLegibility;*/
}

.img-fluid {
  width: 100%;
  height: auto;
}

.header-logo {
  width: 240px;
  margin: 20px auto;
}

.hero-start {
  margin: 3rem 0 0 0;
}

.h1, h1 {
  font-family: 'Schnyder S';
  font-style: italic;
  font-size: 2.8rem;
  /* letter-spacing: .1rem; */
  -moz-osx-font-smoothing: grayscale;
}

.h2, h2 {
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  color: #99846D;
  text-transform: uppercase;
  letter-spacing: .2rem;
  font-size: 1em; 
}




p, a {
  color: #1a1a1a;
  /* letter-spacing: .05em; */
  position: relative;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

a:hover {
  color: #1a1a1a;
  text-decoration: none;
  cursor: pointer;
}

.h3, h3 {
  font-family: 'Schnyder S Light', serif;
  /* letter-spacing: 0.1rem; */
  font-size: 2.2rem;
  font-style: normal;
  letter-spacing: .05rem;
  font-weight: 300;
  display: inline-block;
  position: relative;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

.text-italic {
  font-family: 'Schnyder S';
  font-style: italic;
}

.underline-link:after {
  background:  none repeat scroll 0 0 transparent;
  content: "";
  display: block;
  height: .5px;
  position: absolute;
  background: #1a1a1a;
  transition: width 0.3s ease 0s, left 0.3s ease 0s;
  -webkit-transition: width 0.3s ease 0s, left 0.3s ease 0s;
  -moz-transition: width 0.3s ease 0s, left 0.3s ease 0s;
  -ms-transition: width 0.3s ease 0s, left 0.3s ease 0s;
  -o-transition: width 0.3s ease 0s, left 0.3s ease 0s;
  width: 0;
  cursor: pointer;
}


.underline-link:hover:after {
  width: 100%;
  left: 0;

  }

.h4, h4 {
  font-family: 'Schnyder S Light';
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

.h6, h6 {
  font-family: 'Inter', sans-serif;
  font-style: normal;
  font-weight: 300;
  display: inline-block;
  position: relative;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

.top-buffer {
  margin-top: 10vh;
}

@media (min-width: 1600px) {
  .container-fluid {
    width: 1600px;
  }
}

/* ---------- AUSSTATTUNGS SEITE ----------- */

#img-sm-ausstattung {
  max-width: 300px;
  height: auto;
  margin-top: -20px;
  margin-bottom: -12vh;
}



@media (max-width: 870px) {
  #img-sm-ausstattung {
    display: none;
  }
}



/* --------LOCATION CSS --------------- */



.row.neg-margin {
  margin-left: -60px;
}

.more, .more-re {
  font-size: 12px;
  letter-spacing: .4rem;
  font-weight: normal;
  text-transform: uppercase;
  display: inline-block;
  position: relative;
}


.row.neg-margin-re {
  margin-right: -60px;
}

.gr-btn {
  max-height: 110px;
  width: 110px;
  transition: all 0.3s ease-in-out 0s;
  margin-top: 3vh;
  margin-left: 3vw;
}

.gr-btn:hover {
  transform: rotate(360deg);
  transition: all 0.3s ease-in-out 0s;
}

.scroll-dwn {
  width: 12px;
  margin-top: -30px;
}

hr {
  margin-top: 1rem;
  margin-bottom: 1rem;
  border: 0;
  border-top: 3px solid #E0DDD6;
}




/* -------- DIZZLES HOME --------------- */

@media (min-width:768px) {
#img-up{
  margin-top: -100px;
}
#img-up-dh {
  margin-top: -90px;
}

}


.line-small {
  width: 60vw;
  max-width: 450px;
  margin-right: auto;
  margin-left: auto;
  margin-top: 34px;
}

.scroll-dwn-2 {
  width: 12px;
  margin-bottom: 10px;
}

@media (max-width: 300px) {
  .scroll-dwn-2 {
    display: none;
    /*width: 12px;*/
    /*margin-bottom: 10px;*/
  }
}

.wide {
  max-width: 100%;
  position: relative;
  text-align: center;
}

@media (max-width: 767px) {
  .scroll-dwn-2 {
    display: none;
  }
  .sm-smaller {
    margin-top: 4vh;
  }
}


@media (max-width: 767px) {
  .sm-no {
    display: none;
  }
}

@media (min-width: 768px) {
  .top-margin {
    margin-top: -180px;
  }
}


/* ----------------- FOOTER BEREICH ------------------------- */

.footer-logo {
  background-color: #E0DDD6;
}

#footer-logo-img {
  margin-top: 3vw;
  margin-bottom: 3vw;
}

.img-social {
  width: 40px;
  /*margin-top: 16px;*/
}

.img-social.re {
  margin-left: 15px;
}

.vl {
  border-left: 2px solid #E0DDD6;
  height: 300px;
  margin-left: 0;
  top: 0;
}


.aside {
  margin-left: 8vw;
  /* margin-top: 6vh; */
}

@media (max-width:767px){ 
.vl {
  display: none;
}

  .aside {
  margin-left:0;
}


}

.input-newsletter {
  font-family: 'Inter', sans-serif;
  font-size: .8rem;
  border-top: 0;
  border-left: 1px solid black;
  border-right: 1px solid black;
  border-bottom: 1px solid black;
  border-radius: 0;
  padding: 3px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  background-color: #f0efec;
}

.newsletter-bereich li {
  list-style: none;
}

input:focus {
  outline: none !important;
  /*border-color: #719ECE;*/
  box-shadow: none !important;
}

#datenschutz {
  padding-left: 10px;
  font-size: 0.8em;
  line-height: 0.5;
}

/* input[type=checkbox] {
  height: 15px;
  vertical-align: top;
} */

#newsletterLine {
  margin-left: 8vw;
  margin-right: 8vw;
}

.btn-outline-dark {
  color: #1a1a1a ;
  border-color: #1a1a1a; 
}

.btn-outline-dark:hover {
  background-color: #1a1a1a !important;
}

.btn-group-sm > .btn, .btn-sm {
  padding: .25rem .5rem;
  font-size: .875rem;
  letter-spacing: 0.1rem;
  line-height: 1.5;
  border-radius: 0;
  
}

.btn-sm:focus {
  outline: none !important;
  box-shadow: none !important;
}

.button-buffer {
  margin-bottom: 10vh;
}

.nl-eye {
  position: relative;
  top:0;
  left: 0;
}

#eyeText {
  max-width: 120px;
height: auto;
  top: 0;
  left: 0;
  position: relative;
  transition: all 0.3s ease-in-out 0s;
}

#eye {
  position: absolute;
  max-width: 120px;
  height: auto;
  top: 0;
  left: 0;
}

#eyeText:hover {
  transform: rotate(360deg);
  transition: all 0.3s ease-in-out 0s;
}



/* -------- LOCATION SEITE --------------- */

/* -------- IMG Banner Full --------------- */

.wide-banner {
  position: relative;
  background-color: black;
  height: 85vh;
  min-height: 25vh;
  width: 100%;
  overflow: hidden;
}


.wide-phone {
  position: relative;
  background-color: black;
  height: 55vh;
  min-height: 25vh;
  width: 100%;
  overflow: hidden;
}

.wide-banner img {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  /* z-index: 0; */
  -ms-transform: translateX(-50%) translateY(0);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

.wide-banner .container {
  position: relative;
  /* z-index: 2; */
}

.wide-banner .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: black;
  opacity: .7;
  /* z-index: 1; */
}



.wide-banner #BannerImg {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

.wide-banner #PhoneImg {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

.Location-Logo {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}




.fadeImage { 

  -webkit-animation: fadein 3s; 
  -moz-animation: fadein 3s; 
  -ms-animation: fadein 3s; 
  -o-animation: fadein 3s; 
  animation: fadein 2s;
}

@keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@-moz-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@-webkit-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@-ms-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@-o-keyframes fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}




/* -------- STARTSEITE --------------- */

/* -------- VIDEO HEADER --------------- */

#videoHeader {
  position: relative;
  background-color: white;
  height: 100vh;
  min-height: 25rem;
  width: 100%;
  overflow: hidden;
}

@media (max-width:767px) {
  #videoHeader {
    height: 40vh;
  }

  #videoHeader video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    /* z-index: 0; */
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
  }
}

#videoHeader video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  /* z-index: 0; */
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

/* .video-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.3);
  z-index: 2;
  
} */

#videoHeader .container {
  position: relative;
  /* z-index: 2; */
}

/* #videoHeader .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: black;
  opacity: .3;

} */



#homeImg-1, #homeImg-2 {
  margin-top: -120px;
}

@media (max-width: 1000px) {
  #homeImg-1, #homeImg-2 {
    margin-top: 10px;
  }
}

.p-white {
  color: white;
  font-size: .8rem;
}

.arrow-link {
  color: white;
  font-size: .8rem;
  letter-spacing: .2rem;
  text-transform: uppercase;
}

.arrow-link:hover {
  color: white;
}

/* ---------- CATERIZZLE IMAGE SLIDER ----------- */ 

.slider {
  max-width: 100%;
  height: 500px;
  /* margin: 20px auto; */
  position: relative;
  overflow: hidden;
}
.slide1,.slide2,.slide3 {
  position: absolute;
  width: 100%;
  height: 100%;
 
}
.slide1 {
  /* background:no-repeat center; */
  background-size: cover;
  animation:fade1 10s infinite;
  -webkit-animation:fade1 10s infinite;

} 
.slide2 {
  /* background: url(/assets/img/Home_Caterizzel_Cakes.jpg)no-repeat center; */
  background-size: cover;
  animation:fade2 10s infinite;
  -webkit-animation:fade2 10s infinite;
}
.slide3 {
  /* background: url(/assets/img/Home_Caterizzle_Antipasti_Platte.jpg)no-repeat center; */
  background-size: cover;
  animation:fade3 10s infinite;
  -webkit-animation:fade3 10s infinite;
}

@keyframes fade
{
  0%   {opacity:1}
  33.333% { opacity: 0}
  66.666% { opacity: 0}
  100% { opacity: 1}
}
@keyframes fade2
{
  0%   {opacity:0}
  33.333% { opacity: 1}
  66.666% { opacity: 0 }
  100% { opacity: 0}
}
@keyframes fade3
{
  0%   {opacity:0}
  33.333% { opacity: 0}
  66.666% { opacity: 1}
  100% { opacity: 0}
}


/* --------- ZWEITER SLIDER ------------ */

.slider-2 {
  max-width: 100%;
  height: 500px;
  /* margin: 20px auto; */
  position: relative;
  overflow: hidden;
  object-position: 40%;

  
}
.slide4,.slide5,.slide6 {
  position: absolute;
  width: 100%;
  height: 100%;
 
}
.slide4 {
  /*background: url(/assets/img/Home__Caterizzle_Eis_am_Stiel.jpg)no-repeat center;
  */background-size: cover;
  animation:fade1 12s infinite;
  -webkit-animation:fade1 12s infinite;
} 
.slide5 {
  /*background: url(/assets/img/Home__Caterizzle_Haxe.jpg)no-repeat center;
  */background-size: cover;
  animation:fade2 12s infinite;
  -webkit-animation:fade2 12s infinite;
}
.slide6 {
  /*background: url(/assets/img/Home_Caterizzle_wasser.jpg)no-repeat center;
  */background-size: cover;
  animation:fade3 12s infinite;
  -webkit-animation:fade3 12s infinite;
}


.catering-colorchange {
  padding-top: 10vh;
  padding-bottom: 10vh;
  text-decoration: none;
  -webkit-transition: background 1.4s;
  transition: background 1.4s;
  -moz-transition: background 1.4s;
  -ms-transition: background 1.4s;
  -o-transition: background 1.4s;
}

.catering-colorchange:hover {
  background: #1A1A1A;
  color: white;
}

.catering-colorchange a::after {
  color: #99846D;
}

.more-beige {
  font-size: 12px;
  letter-spacing: .4rem;
  font-weight: normal;
  text-transform: uppercase;
  display: inline-block;
  position: relative;
  color: #99846D;
}

.more-beige::after {  
  content: url("../../assets/images/home/pfeil-beige-re.svg");
  display: inline-block;
  width: 76px;
  height: 11px;
  position: relative;
  left: 15px;
  font-weight: bold;
}

.more-beige:hover {
  color: #99846D;
}



@media (max-width:767px){
  .catering-colorchange {
    padding-top: 5vh;
    padding-bottom: 5vh;
  }

.slider {
  height: 250px;
}
.slider-2 {
  height: 250px;
}
}

.header {
  position: relative;
  height: 85vh;
  min-height: 25vh;
  width: 100%;
  overflow: hidden;
}

@media (max-width:767px) {
  .header{ 
  height: 65vh;
}}

.h3-italic {
  font-family: 'Schnyder S';
}

.arrow-link::after {
  content: url("../../assets/img/pfeil-weiss-re.svg");
  display: inline-block;
  width: 76px;
  height: 11px;
  position: relative;
  left: 15px;
  font-weight: bold;
}

.arrow-link:active {
color: white;
}

.more::after {
  content: url("../../assets/img/pfeil-re.svg");
  display: inline-block;
  width: 76px;
  height: 11px;
  position: relative;
  left: 15px;
  /*left: 0px;*/
  /*font-weight: bold;*/
  /*top: -3px;*/
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}



.more-re::before {
  content: url("../../assets/img/pfeil-li.svg");
  display: inline-block;
  width: 76px;
  height: 11px;
  position: relative;
  right: 15px;
  /*left: 0px;*/
  /*font-weight: bold;*/
  /*top: -3px;*/
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}


@media (min-width:768px) {
.history-text2 {
  margin-top: 15vh;
  margin-bottom: 10vh;
}
}

.img-center {
  margin: 8vh auto;
  display: block;
  width: 240px;
}

.img-denker {
  margin: 8vh auto 4vh auto;
  display: block;
  width: 340px;
}

@media (max-width: 833px) {
  .img-center {
    margin: 4vh auto;
    /*display: block;*/
    /*width: 240px;*/
  }
}



@media (max-width: 992px) {
  .anfrage-text {
    margin-top: 2vh;
  }
}

#map{
  height: 700px;
  width: 100%;
}

/* -------- INDEX LOGIN ------- */

.start-login {
  margin-top:10 vh;
  margin-left: 10vw !important;
  max-width: 320px;
  width: 100%;
  
  
  padding: 40px;
  border-radius: 4px;
  color: #1a1a1a;
}

.start-login form {
  color: #1a1a1a;
}



/* ----------  LOGIN SEITE  ------------- */
.login-clean {
  position: relative;
}

.login-form {
  margin-top: 10vh;
 margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: column;
  
}

.login-clean form {
  max-width: 320px;
  width: 100%;
  
  /*margin: 0 auto;*/
  /*padding-top: 20vh;*/
  background-color: #ffffff;
  padding: 40px;
  border-radius: 4px;
  color: #1a1a1a;
  /*box-shadow: 1px 1px 5px rgba(0,0,0,0.1);*/
}

.login-clean form .form-controls {
  background: white;
  border-top: none;
  border-bottom: 1px solid #1a1a1a;
  border-right: 1px solid #1a1a1a;
  border-left: 1px solid #1a1a1a;
  border-radius: 0;
  box-shadow: none;
  outline: none;
  color: inherit;
  /*text-indent: 8px;*/
  height: 28px;
}

.form-controls:focus {
  color: #495057;
  background-color: #fff;
  border-color: #E0DDD6;
  outline: 0;
  /*box-shadow: 0 0 0 .2rem rgba(0,123,255,.25);*/
}

.form-controls {
  width: 100%;
  padding-left: 10px;
}

#smalltext {
  /* padding-left: 10px; */
  font-size: 0.8em;
  line-height: 0.8;
  color: #1A1A1A;
  text-decoration: underline;
}

.login-clean form .register {
display: block;
text-align: center;
}

/* -------- parallax banner --------- */



.parallax-ios {
  position:relative;
  height: 65vh;
  overflow: hidden;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  display : flex;
  align-items : center;
  
}


    @media only screen and (min-width:767px) {
      .parallax-ios {
        height: 65vh;
        min-height: 830px;
      }
      
    }


.parallax-ios img {
  position: absolute;
}


/* ----------- kulinarik --------- */

.cat-logo {
  width: 300px;
  height: auto;
  margin: 40px auto;
}

/* ----------- wufoo formular - Anfrage --------------- */

.newsletter-bereich li {
  list-style: none;
}


.wufoo li {
  padding-top: 20px;
  list-style: none;
}

input {
  width:100%;
  height: 25px;
  border-top: 0;
  border-left: 1px solid black;
  border-right: 1px solid black;
  border-bottom: 1px solid black;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  padding-left: .3rem;
  background-color:#f0efec ;
}

select {
  width: 100%;
  height: 25px;
  border-top: 0;
  border-left: 1px solid black;
  border-right: 1px solid black;
  border-bottom: 1px solid black;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  background-color:#f0efec ;
  padding-left: .3rem;
  /* -webkit-appearance: none; */

}


textarea {
  width:90%;
  height: 200px;
  background-color:#f0efec ;
  border-top: 0;
  border-left: 1px solid black;
  border-right: 1px solid black;
  border-bottom: 1px solid black;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  padding-left: .3rem
}


@media (max-width:768px) {
  textarea {
  width: 100%;
}
}

input[type="checkbox"] {
  width: 12px;
  height: 12px;
  margin-top: 5px;
  border-radius: 0;
  border-top: 1px solid black;
  border-left: 1px solid black;
  border-right: 1px solid black;
  border-bottom: 1px solid black;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  vertical-align: top;
  box-shadow: none;
  /* background-image: url("assets/images/svg/checkbox.svg"); */
  background-color:#f0efec ;
  /* -webkit-appearance: none; */
}

/* input[type='checkbox']:checked + label {
  background-image: url("data:image/svg+xml,%3C?xml version='1.0' encoding='iso-8859-1'?%3E %3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E %3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='533.333px' height='533.333px' viewBox='0 0 533.333 533.333' style='enable-background:new 0 0 533.333 533.333;' xml:space='preserve'%3E %3Cg%3E %3Cpath d='M0,0v533.333h533.333V0H0z M500,500H33.333V33.333H500V500z M400,116.667L233.333,283.333l-100-100L66.667,250 l166.667,166.667l233.333-233.333L400,116.667z'/%3E %3C/g%3E %3C/svg%3E ");
} */

/* .checkform {
  width: 12px;
  height: 12px;
  top: -2px;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  vertical-align: top;
  box-shadow: none;
} */

.legalfield {
margin-top:20px
}

.legalfield input {
  margin-right: 8px
}

.legalfield ul {
  margin-top: 0;
  margin-bottom: 0;
}

.legalfield li {
  padding-top: 0;
}
.legal {
  font-size: .8em;
  line-height: 1.3;
  /* letter-spacing: .05em; */
}

select:focus {
  outline: none !important;
  box-shadow: none !important;
}

textarea:focus {
  outline: none !important;
  box-shadow: none !important;
}

.btn-group-sm > .btn, .btn-submit {
  padding: .25rem 2rem;
  font-size: .875rem;
  letter-spacing: 0.1rem;
  line-height: 1.5;
  border-radius: 0;
}

/* .gs_reveal {
  opacity: 0;
} */


.covid-info {
  background-color: #E0DDD6;
  height: auto;
  width: 100%;
}

.covid-text {
  font-size: 18px;
}


.covid-bold {
  font-weight: 700;
}




/* ----HISTORY---- */

.team-carousel {
  height: 600px;
  width: 100%;
  background-color: #1a1a1a;
}