@import url(animate.css);
/* @import url(//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css);   hat nicht funktioniert*/
@import url("https://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css");
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400;1,600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat+Alternates:wght@300;400;500;600&display=swap');
/*========================================================
                      Main Styles
=========================================================*/
html { scroll-behavior: smooth; }

body {
  color: #e1e1e1;  /*  dddcdc */
  font: 20px/26px "Montserrat", sans-serif;
  font-weight: 400;
  -webkit-text-size-adjust: none;
  background: #f6f4f1; }

body * {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }
  @media (max-width: 992px) {
    body { font: 400 21px/26px "Montserrat", sans-serif; } }

body.impr {
  background: url("../images/header_img.jpg") no-repeat center center fixed;
  background-size: cover; }

img {
  max-width: 100%;
  height: auto; }

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  font-weight: 400;
  font-family: "Montserrat", sans-serif; }
  @media (max-width: 992px) {
    h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
      font-weight: 400; } }


h1, .h1 {
  font-size: 65px;
  line-height: 80px; }
  @media (max-width: 992px) {
    h1, .h1 {
      font-size: 60px;
      line-height: 70px;
      padding: 0 20px;
      font-weight: 500; } }

h2, .h2 {
  font-size: 50px;
  line-height: 50px; }

h3, .h3 {
  font-size: 35px;
  line-height: 40px; }
  @media (max-width: 992px) {
    h3, .h3 { font-size: 37px; font-weight: 400;}  }

h4, .h4 {
  font-size: 25px;
  line-height: 25px; }

h5, .h5 {
  font-size: 20px;
  line-height: 26px; }
  @media (max-width: 992px) {
    h5, .h5 {
      font-size: 23px;
      line-height: 29px;
      font-weight: 400;
      letter-spacing: 1px;} }

h6, .h6 {
  font-size: 21px;
  line-height: 29px; }


  @media (min-width: 992px) {
      a:hover, footer a:hover { text-decoration: underline; color: #eb6d29; }
      }
  @media (max-width: 992px) {
      a, footer a { text-decoration: underline; color: #eb6d29; }
      }

.p a:hover, .marked-list a:hover, .list a:hover {
  text-decoration: underline; color: #eb6d29; }
p .fa, .marked-list .fa, .list .fa {
  text-decoration: none; }

time {
  display: block; }

a {
  font: inherit;
  color: inherit;
  text-decoration: none;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -webkit-transition: 0.3s;
  transition: 0.3s; }
  a:focus {
    outline: none; }
  a:active {
    background-color: transparent; }

a[href^="tel:"],
a[href^="callto:"] {
  color: inherit;
  text-decoration: none; }

strong {
  font-weight: 700; }

.fa {
  line-height: inherit; }

[class*='fa-']:before {
  font-weight: 400;
  font-family: "FontAwesome"; }

.page { border:
  overflow: hidden;
  min-height: 500px; }

.lt-ie9 .page {
  min-width: 1200px; }

.fw-n {
  font-weight: 400; }

.fw-b {
  font-weight: 500; }

.fw-sb {
  font-weight: 600; }

.text-uppercase {
  text-transform: uppercase; }

.default-dark {   /*   f6f6f6 */
  color: #525557; }

.default-darker {
  color: #bbbaba; }

.default-light {
  color: #ffffff; }  /*  Schrift Fliesstext */

.default-realdark {
  color: #6e6c6c; }

.clr-secondary {
  color: #464646; }  /*  Headlines */

.secondary-dark {
  color: #363636; }

.secondary-light {
  color: #717171; }  /* Adresse unten*/

.clr-primary {
  color: #b64b1c; }  /* dunkel-orange      */

.color-bg {
  color: #ffffff;
}

@media (max-width: 992px) {
  .center767 {
    text-align: center; }
    .center767 * {
      text-align: center; } }

@media (max-width: 992px) {
  .center991 {
    text-align: center; }
    .center991 * {
      text-align: center; } }

@media (min-width: 765px) and (max-width: 992px) { .t_gyoza { margin: 0 25%; } }

.img-circle {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  margin-top: 30px; }

.img-border {
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px; }

.text-center {
  text-align: center; }

.text-left {
  text-align: left; }

.mg-add {
  margin-top: -122px; }

.mg-add2 {
  margin-top: 10px; }

.mg-add3 {
  margin-top: 25px; }

/*=======================================================
                       Main Layout
=========================================================*/

* + p {
  margin-top: 30px; }

* + p.h5 {         /*   TCM Text   */
  margin: 0; }
/*
.panel h5 { margin: 20px 10px 15px 0; }
*/
img + h3 + h5, img + h3 {
  margin-top: 35px; }

* + .btn-link {
  margin-top: 55px; }

* + .offs {
  margin-top: 45px; }


* + h2 {
  margin-top: 41px; }

* + .subscribe {
  margin-top: 64px; }

/*=======================================================
                        Components
=========================================================*/
/*==================     Brand     ======================*/
.brand {
  display: inline-block;
  max-width: 411px;
  position: relative;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -webkit-transition: 0.3s;
  transition: 0.3s; }

  .brand:before {                                      /*  HG img    */
    content: url("../images/logo_img.png");
    position: absolute;
    left: 50%;
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    top: 65px;
    z-index: 1;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    -webkit-transition: 0.3s;
    transition: 0.3s; }


  @media (max-width: 992px) {
    .brand:before {
      content: url("../images/logo-m_img.png");
      top: 45px;
    } }

  @media (min-width: 765px) and (max-width: 992px) {
    .brand:before {
      content: url("../images/logo_img.png");
      top: 45px;
    }
    .brand .brand-name {
      line-height: 150px;
      margin-top: 200px; }
  }

    .brand-unten:before {                                /*  HG img footer    */
      content: url("../images/logo-kl_img.png");
      height: 250px;
      position: absolute;
      bottom: 35px;
      left: 50%;
      -moz-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%);
      z-index: 1;
      -moz-transition: 0.3s;
      -o-transition: 0.3s;
      -webkit-transition: 0.3s;
      transition: 0.3s; }

  .brand .brand-name {
    position: relative;
    font-family: "Montserrat", sans-serif;
    text-align: center;
    line-height: 90px;
    z-index: 2;
    margin-top: 55px; }

    .brand .brand-bottom {
      line-height: 68px;
      padding-bottom: 30px;}

  .brand_impressum {
    display: inline-block;
    max-width: 411px;
    position: relative;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    -webkit-transition: 0.3s;
    transition: 0.3s; }


  .brand_impressum:before {                                      /*  HG img Impressum-Seite    */
    content: url("../images/logo-kl_img.png");
    position: absolute;
    left: 50%;
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    top: 65px;
    z-index: 1;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    -webkit-transition: 0.3s;
    transition: 0.3s; }

/*==================  Backgrounds  ======================*/
.bg-primary { background: #f6f4f1; }

.bg-menue { background: #565656; }  /* grau von Flyer */

.bg-light { background: url("../images/hg-rice-paper-2.png"); }

.bg-dark { background: #77b4d7; background: url("../images/hg-rice-paper-orange.jpg");  }

.bg-default { background: #fff; }


/*==============    Blockquote      ==============*/
.blockquote p > cite {
  display: inline-block;
  position: relative;
  padding-left: 140px;
  font-style: normal;
  line-height: 20px;
  text-align: left; }
  .blockquote p > cite span {
    display: inline-block; }
  .blockquote p > cite:before {
    display: inline-block;
    content: "\f007";
    position: absolute;
    left: 0;
    top: -27px;
    width: 101px;
    height: 101px;
    line-height: 101px;
    background: #fd7400;
    text-align: center;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    color: #fff;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    -webkit-transition: 0.3s;
    transition: 0.3s;
    font: 400 25px/101px "FontAwesome"; }
.blockquote p.quote {
  padding-left: 40px;
  padding-right: 40px; }
.blockquote p > q {
  position: relative;
  display: inline-block; }
  .blockquote p > q:before, .blockquote p > q:after {
    display: block;
    content: url("../images/quote_img.png");
    position: absolute;
    font-size: 60px;
    font-family: "Montserrat", sans-serif;
    color: #fff;
    top: -22px; }
  .blockquote p > q:before {
    left: -30px; }
  .blockquote p > q:after {
    right: -30px; }
.blockquote p + h5 {
  margin-top: 90px; }
.blockquote * + .quote {
  margin-top: 11px; }

/*==================      Box      ======================*/

.box:before, .box:after {
  display: table;
  content: "";
  line-height: 0; }
.box:after {
  clear: both; }
.box_aside {
  float: left;
  margin-bottom: 0px; }  /*  margin-right: 30px;  */
.box_cnt__no-flow {
  overflow: hidden; }
.box + .box {
  margin-top: 35px; }
.box * + p {
  margin-top: 35px; }
  @media (max-width: 992px) {
    .box {
      text-align: center;
      margin 0; }
    .box_aside {
      float: none;
      margin 0; }
  }

/*==================     ToTop     ======================*/
.toTop {
  width: 50px;
  height: 50px;
  font-size: 24px;
  line-height: 46px;
  color: #fff;
  background: #464646;
  border-radius: 50%;
  -webkit-box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.4);
  box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.4);
  position: fixed;
  right: 40px;
  bottom: 40px;
  display: none;
  overflow: hidden;
  text-align: center;
  text-decoration: none;
  z-index: 20; }
  .toTop:hover {
    color: #fff;
    background: #eb6d29;
    text-decoration: none; }

.mobile .toTop,
.tablet .toTop {
  display: none !important; }

/*==================  RD Parallax    ======================*/
.parallax {
  position: relative;
  overflow: hidden; }
  .parallax_image, .parallax_pattern {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    background-position: center center;
    will-change: transform; }
  .parallax_image {
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-size: cover; }
  .parallax_pattern {
    background-repeat: repeat; }
  .parallax_cnt {
    position: relative; }

    .parallax_cnt * + .h5 {
      margin-top: 40px; }
        .well2 .parallax_cnt * + .h6 {         /* ? */
          margin-top: 20px; }

    .parallax_cnt * + .btn-link {
      margin-top: 62px; }

    .parallax-color { color: #fff; }

/*========================================================
                     HEADER  Section
=========================================================*/
header {
  background: url("../images/header_img.jpg") no-repeat;
  background-position: center top;
  background-size: cover;
  text-align: center;
  position: relative;
  padding-bottom: 350px; }

header.impr_inhalt { background: none; }

  @media (max-width: 992px) {
    header {
      text-align: center;
      background: url("../images/header_img-mobile.jpg") no-repeat;
      background-position: center top;
      background-size: cover;position: relative;
       }
    }

header h1 { color: #fff; }

header .header-caption {
  margin-top: 580px;
  margin-bottom: 150px; }

  @media (max-width: 992px) {
    header .header-caption { padding: 75% 0 0 0; margin-bottom: -56%; margin-top: 70px;  }
    header .header-caption h1 { font-weight: 400; font-size: 50px; line-height: 50px; }
    header .header-caption h3 { font-weight: 400; font-size: 105%; }
    header .header-caption p { color: #ffffff; margin-bottom: 15px; line-height: 100px;}
    header .header-caption ul li div { text-align: right; padding-right: 7px; }
    header .header-caption ul li div.tag { text-align: right; padding-right: 8px; width: 40%; }
    header .header-caption ul li div.uhr { text-align: left; width: 55%; }
  }

  @media (min-width: 765px) and (max-width: 992px) {
    header .header-caption {
      margin-top: 25px;
      margin-bottom: -25px;}
  }

header.impr_inhalt .header-caption { margin-top: 350px; color: #ffffff; }
  @media (max-width: 992px) { header.impr_inhalt .header-caption { margin-top: 15px; color: #ffffff; } }

header .header-caption * + .h5 { margin-top: 33px; }
header .header-caption * + .btn-link { margin-top: 62px; }

header .header-caption p {
  font-size: 20px; font-weight: 400;
  line-height: 27px;
  }

/* - - - - - Adresse & Oeffnungszeit - - - - - */

p.adr-le { font-size: 130%; color: #ffffff; }
@media (min-width: 992px) {
      header .header-caption p.adr-le {
        position: absolute; top: 55px; right: calc(50% + 175px);
        width: 400px;
        text-align: right;
        color: #ffffff;
        }
      header .header-caption ul.adr-re {
        position: absolute; top: 55px; left: calc(50% + 175px);
        margin-top: 25px;
        width: 400px;
        text-align: left;
        color: #ffffff;
        }
}

ul.woche li div { display: inline-block; }
ul.woche li div { width: 50%; text-align: left; }
ul.woche li div.tag { width: 22%; }



/*==================  Inline List  ======================*/
.inline-list li {
  display: inline-block;
  width: 77px;
  height: 77px;
  line-height: 77px;
  background: #363636;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  font-size: 25px;
  color: #fff;
  -moz-transition: 0.3s;
  -o-transition: 0.3s;
  -webkit-transition: 0.3s;
  transition: 0.3s; }
  .inline-list li:hover {
    background: #fd7400; }
.inline-list li + li {
  margin-left: 22px; }
@media (max-width: 1199px) {
  .inline-list li + li {
    margin-left: 14px; } }

/*========================================================
                     CONTENT  Section
=========================================================*/
main {
  display: block; }

/*==================      Well     ======================*/
.well {
  padding-top: 0;
  padding-bottom: 50px; } /* 50 */

.well2 {
  padding-top: 50px;
  padding-bottom: 100px; }


.well3 {
  padding-top: 30px;
  padding-bottom: 20px;
 }
  @media (max-width: 992px) {
    .well3, .well6 { padding: 75px 15px 15px 15px; }
   }

.well4 {
  padding-top: 60px;
  padding-bottom: 70px; }

.well5 {
  padding-top: 80px;
  padding-bottom: 100px; }

.well6 {
  padding-top: 30px;
  padding-bottom: 65px; }

  @media (min-width: 992px) and (max-width: 1199px) {
    .well3 .m-tablet { width: 1000px; padding: 0 155px; }
   }

 @media (max-width: 992px) {
   .well2, .well3, .well4, .well5, .well6 {
     padding-top: 25px;
     padding-bottom: 25px; } }

/*========================================================
                     FOOTER  Styles
=========================================================*/
footer {
  padding-top: 0px;
  padding-bottom: 115px;
  margin-top: 25px;
  position: relative; }
  footer:before, footer:after {
    display: table;
    content: "";
    line-height: 0; }
  footer:after {
    clear: both; }

  footer .rights {
    width: 380px;
    margin-top: 65px;
    float: left;
    text-align: right; }
    @media (max-width: 992px) { footer .rights {  } }

  footer .impressum {margin-top: 20px; font-size: 80%; }
    @media (max-width: 992px) {
      footer .impressum { margin: 15px 0 10px 0; font-size: 100%; }
      footer .rights, footer .info { line-height: 140%; }
    }

  footer .rights span:first-child {}

  footer .brand {
    position: absolute;
    bottom: 300px;  /*   -30 ???   */
    left: 50%;
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    color: #fff; }

    footer .brand .brand-name {
      margin-bottom: 28px; }

    footer .brand:before {  }

  footer .inline-list {
    margin-top: 40px;
    float: right; }

  footer .info {
    text-align: left;
    margin-top: 65px;
    float: right;
    width: 400px; }

  footer ul.info li div { display: inline-block; }
  footer ul.info li div.tag { width: 20%; }

  @media (max-width: 1111px) {
    footer ul.info li.m_woche { margin-top: 15px; }
    footer ul.info li div.tag { width: 30%; text-align: right; padding-right: 8px ; }
    footer ul.info li div.uhr { width: 40%; text-align: left; }
  }

  @media (max-width: 992px) {
    footer {
    padding-top: 20px;
    padding-bottom: 310px; }
    footer .rights, footer .info, footer .inline-list {
      width: 100%;
      margin: 0;
      padding-top: 10px;
      text-align: center; } }

  @media (min-width: 992px) and (max-width: 1200px) {
    footer .info { width: 350px; }
      footer ul.info li.m_woche { margin-top: 15px; }
      footer ul.info li div.tag { width: 25%; text-align: left; }
      footer ul.info li div.uhr { width: 55%; text-align: left; }

   }

/*   - - - - - - - - - - - - - N A V I  toggle - - - - - - - - - - - - - */

/* Navigation Button  */

 .nav-button {
   background-image:url(../images/auf.jpg);
   display: block;
   position: fixed;
   top: 0;
   right: 0;
   width: 60px;
   height: 60px;
   cursor: pointer;
   z-index: 999;
   border: none;
   text-decoration: none;
   /*text-indent: -9999px;*/

 }

.primary-nav {
  width: 100%;
  float: none;
  background-color: rgba(0,0,0,.75); /* menu color */
  margin: 0;
  padding: 0;
  overflow: hidden;
  position: fixed;
  top: 0px;
  right: 0px;
  z-index: 998;
  clear: both;
}

.primary-nav li {
  display: none;
  width: 100%;
}
.primary-nav li a {
  display: block;
  width: 100%;
  padding: 10px 10%;
  font-size: 110%;
  line-height: 135%;
  text-align: left;
  text-decoration: none;
}
.primary-nav li a:hover {
  background-color: rgba(0,0,0,.5);
}

@media (min-width: 992px) {
  .primary-nav {
    width: 300px;
    padding-left: 25px;
  }
 }

@media (min-width: 765px) and (max-width: 992px) {
   .primary-nav li a { font-size: 125%;
     width: 40%;
     margin: 0 auto;
     margin-bottom: 5px;
   }
   ul.menue { }
   ul.menue li a { margin-bottom: 5px;}
  }

/* Toggle the navigation bar open  */

.primary-nav.open {
  height: auto;
  padding-top: 25px;
}
.primary-nav.open li {
  display: block;
}

.primary-nav.close {
  height:0;
  padding-top:0;
}
.primary-nav.close li {
  display:none;
}

ul.menue {margin-left: 25px;}
ul.menue li a { padding: 2px 10%; }

header nav ul.primary-nav li a.pfeil_rauf {          /* Pfeil Nav */
  font-size: 250%; line-height: 0.3; margin-bottom: 35px; }

header.impr_inhalt a p.pfeil_li { font-size: 200%; padding: 25px 0; }


/* - - - - - Lieferservice - - - - - */


a#lieferservice { width: 100px; height: 100px;	background: url(../images/Lieferando.png) no-repeat 0 0; position: absolute; bottom: 7%; right: 7%;  }
@media (min-width: 1250px) { a#lieferservice:hover { width: 100px; height: 100px; background: url(../images/Lieferando_a.png) no-repeat 0 0; } }

@media (max-width: 1250px) { a#lieferservice { width: 100px; height: 100px;	background: url(../images/Lieferando.png) no-repeat 0 0; position: absolute; top: 1%; left: 2.5%; } }


p.Lieferung { padding-bottom: 15px; }

/* - - - - - Open Maps - - - - - */

small { margin: 5px; font-size: 70%; }

.map {
     width: 100%;
     height: 330px;
     background-color: #f6f4f1;

 }
 @media (max-width: 992px) {
        .map {height: 300px; margin-bottom: 35px; padding: 10px 10px 0 10px; }
        small { font-size: 75%; }
      }

/* - - - - - Impressum - - - - - */

header.impressum {
  background: url("../images/header_impressum.jpg") no-repeat;
  background-position: center top;
  background-size: cover;
  text-align: center;
  position: relative;}

@media (min-width: 992px){
  header.impressum .header-caption-im { margin: 0px 0px 150px 0; } }


div.txt_impressum { }

header.impressum h1 { margin-top: 300px; }

div.txt_impressum h6 {
    margin: 30px 0 10px 0;
    font-size: 24px; }

div.txt_impressum p {
    margin: 5px;
    font-size: 22px; }

.txt_impressum .mehr {
    margin: 30px 0 10px 0;
}

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

@media (max-width: 1200px) { .m_nein, br.m_nein, span.m_nein { display: none; } }
@media (min-width: 1200px) { .w_nein { display: none; } }
@media (max-width: 768px) { .pm_nein { display: none; } }
@media (min-width: 768px) { .pw_nein { display: none; } }

@media (max-width: 992px) { .m_img_nein { display: none; } }
@media (min-width: 992px) { .w_img_nein { display: none; } }
@media (min-width: 765px) and (max-width: 992px) { .t_img_nein { display: none; } }

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

.klein { font-size: 75%; }



@media (max-width: 765px) {
  .img_m_kl { width: 50%; margin: -20px 0 -35px 0;}
  .img_m_kl2 { width: 50%; margin: 0;}
}


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