@charset "UTF-8";
/* =============================================================================
      Start Border-Box Trick */
html {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 16px;
    font-family: 'PT Serif', serif;
}

*, *:before, *:after {
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
}

/* Ende Border-Box
  ============================================================================= */

body {
    font-size: 17px;
    font-weight: normal;
    line-height: 32px;
    color: #85847F;
    background-image: linear-gradient(to top, #FFF2EC, white);

}

.clearfix {
    clear: both;
}

a {
    text-decoration: none;
    font-size: 18px;
    font-weight: normal;
}

ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}
#info {
    cursor: pointer;
}

/* =============================================================================
  Schriftgrössen Mobile */

h1 {
    font-size: 24px;
    line-height: 34px;
}

h2 {
    font-size: 20px;
    line-height: 30px;
}

h3 {
    font-size: 16px;
    line-height: 26px;
}

/* =============================================================================
    Schriftgrössen Tablet*/
@media screen and (min-width: 768px) and (max-width: 1024px) {
    h1 {
        font-size: 32px;
        line-height: 42px;
    }

    h2 {
        font-size: 28px;
        line-height: 38px;
    }

    h3 {
        font-size: 24px;
        line-height: 34px;
    }
}

/* =============================================================================
    Schriftgrössen Desktop */

@media screen and (min-width: 1025px) {
    h1 {
        font-size: 36px;
        line-height: 46px;
    }

    h2 {
        font-size: 32px;
        line-height: 42px;
    }

    h3 {
        font-size: 28px;
        line-height: 38px;
    }
}

/* =============================================================================
      Startseite Mobile */
.wrapper {
    margin: 0 auto;
    padding: 0 1rem;
}

.wrapper_home {
    text-align: center;
    margin: 0 auto;
}
.wrapper_home a {
    text-align: center;
}
.desktop_none {
    display: inline-block;
}

.mobile_none {
    display: none;
}

.single__view {
  margin: 3rem 0;
  -webkit-box-shadow: 0 10px 13px -7px silver, 0 -10px 13px -7px silver, 10px 0 15px -6px  #bb6b4e ;
          box-shadow: 0 10px 13px -7px silver, 0 -10px 13px -7px silver, 10px 0 15px -6px  #bb6b4e ;
  width: 100%;
  height: 104px;
  background-color: white;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}

.single__view > img {
  -webkit-transition: -webkit-transform 400ms ease-out;
  transition: -webkit-transform 400ms ease-out;
  -o-transition: transform 400ms ease-out;
  transition: transform 400ms ease-out;
  transition: transform 400ms ease-out, -webkit-transform 400ms ease-out;
  margin: 0;
  width: 144px;
/*  height: auto;*/
}

.single__view > img:hover {
  -webkit-transform: scale(1.05);
  -ms-transform: scale(1.05);
      transform: scale(1.05);
}
.single__view > h2{
    color: #bb6b4e;
    margin:auto;
}
.zitat {
    text-align: center;
    margin: 0 16px;
    padding: 0;
}

.special_angebot{
  padding: 1rem;
 margin: 0;
 border: transparent;
 -webkit-box-shadow:  -15px 0 15px -13px #bb6b4e, 0 10px 13px -7px silver, 0 -10px 13px -7px silver ;
         box-shadow:  -15px 0 15px -13px #bb6b4e, 0 10px 13px -7px silver, 0 -10px 13px -7px silver ;
 text-align: left;
}

.special_angebot > img{
    align-self: center;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
}
.special_angebot_text{
margin-left: 1rem ;
    text-align: center;
    color: #bb6b4e;

}
.special_angebot_text > h2{
    text-align: center;
    color: #bb6b4e;

}
.special_angebot_text .button__white{
margin: 0 0 0 auto;
}
/* =============================================================================
    Startseite Tablet*/
@media screen and (min-width: 768px) and (max-width: 1024px) {
    .wrapper {
        margin: 0 auto;
        padding: 0 1rem;
    }
    .wrapper_home {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: reverse;
          -ms-flex-direction: row-reverse;
              flex-direction: row-reverse;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
        margin: 0 32px;
    }
    .angebot1 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -ms-flex-pack: distribute;
          justify-content: space-around;
        margin: 48px 0; }

.single__view {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: calc((100% / 2.5) - 8px);
  height: auto;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  margin: 32px;
  -webkit-box-shadow: -5px -5px 10px silver;
          box-shadow: -5px -5px 10px silver;
  text-align: center;
  position: relative;
  border-right: none;
  }

  .single__view:after {
      z-index: -1;
      position: absolute;
      content: "";
      bottom: 15px;
      right: 10px;
      left: auto;
      width: 50%;
      top: 80%;
      max-width: 300px;
      background: #85847F;
      -webkit-box-shadow: 0 15px 10px silver;
              box-shadow: 0 15px 10px silver;
      -webkit-transform: rotate(3deg);
          -ms-transform: rotate(3deg);
              transform: rotate(3deg);
  }
  .single__view > img {
    -webkit-transition: -webkit-transform 400ms ease-out;
transition: -webkit-transform 400ms ease-out;
-o-transition: transform 400ms ease-out;
transition: transform 400ms ease-out;
transition: transform 400ms ease-out, -webkit-transform 400ms ease-out;
      margin-left: 0;
      padding: 1rem;
      width: 100%;
      height: auto;
  }
  .single__view > img:hover {
    -webkit-transform: scale(1.05);
    -ms-transform: scale(1.05);
        transform: scale(1.05);
  }
  .single__view > h2{
      color: #bb6b4e;
      margin: 2.5rem auto;
  }
    .special_angebot{
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
                -ms-flex-direction: row;
                    flex-direction: row;
            margin: 32px;
            -webkit-box-shadow: 0 10px 13px -7px silver, 0 -10px 13px -7px silver, 10px 0 15px -6px #bb6b4e;
                    box-shadow: 0 10px 13px -7px silver, 0 -10px 13px -7px silver, 10px 0 15px -6px #bb6b4e;

    }
    .special_angebot > img{
      /*  width: 343px;
        height: 232px;*/
        margin: 0;
    }
    .special_angebot_text{
        padding: 0;
        width: 100%;
    }
}
    /*====================================================== Startseite Desktop*/
          @media screen and (min-width: 1025px) {
            .wrapper {
              max-width: 1440px;
              width: 100%;
            }
            .wrapper_home{
              display: -webkit-box;
              display: -ms-flexbox;
              display: flex;
              -webkit-box-orient: horizontal;
              -webkit-box-direction: reverse;
                  -ms-flex-direction: row-reverse;
                      flex-direction: row-reverse;
              -webkit-box-pack: justify;
                  -ms-flex-pack: justify;
                      justify-content: space-between;
              margin: 48px 32px;
            }
              .desktop_none {
                display: none;
              }
              .mobile_none {
                display: inline-block;
               }
                .angebot1 {
                  display: -webkit-box;
                  display: -ms-flexbox;
                  display: flex;
                  -webkit-box-orient: horizontal;
                  -webkit-box-direction: normal;
                      -ms-flex-direction: row;
                          flex-direction: row;
                  -ms-flex-pack: distribute;
                      justify-content: space-around;
                  margin: 48px 0;
                }
            .single__view {
              display: -webkit-box;
              display: -ms-flexbox;
              display: flex;
              -webkit-box-orient: vertical;
              -webkit-box-direction: normal;
                  -ms-flex-direction: column;
                      flex-direction: column;
              -ms-flex-pack: distribute;
                  justify-content: space-around;
              width: calc((100% / 3.3) - 12px);
              height: auto;
              margin: 32px;
              -webkit-box-shadow: -5px -5px 10px silver;
                      box-shadow: -5px -5px 10px silver;
              text-align: center;
              position: relative;
              border-right: none;
            }
              .single__view:after {
                z-index: -1;
                position: absolute;
                content: "";
                bottom: 15px;
                right: 10px;
                left: auto;
                width: 50%;
                top: 80%;
                max-width: 300px;
                background: #85847F;
                -webkit-box-shadow: 0 15px 10px silver;
                        box-shadow: 0 15px 10px silver;
                -webkit-transform: rotate(3deg);
                    -ms-transform: rotate(3deg);
                        transform: rotate(3deg);
              }
              .single__view > img {
                -webkit-transition: -webkit-transform 400ms ease-out;
                transition: -webkit-transform 400ms ease-out;
                -o-transition: transform 400ms ease-out;
                transition: transform 400ms ease-out;
                transition: transform 400ms ease-out, -webkit-transform 400ms ease-out;
                margin-left: 0;
                padding: 1rem;
                width: 100%;
                height: auto;
              }
              .single__view > img:hover {
                -webkit-transform: scale(1.05);
                -ms-transform: scale(1.05);
                transform: scale(1.05);
              }
              .single__view > h2{
                  color: #bb6b4e;
                  margin: 2.5rem auto;
              }

              .zitat {
                  padding-bottom: 50px;
                  text-align: right;
              }

              .special_angebot{
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-orient: horizontal;
                -webkit-box-direction: normal;
                    -ms-flex-direction: row;
                        flex-direction: row;
                margin: 32px;
                -webkit-box-shadow: 0 10px 13px -7px silver, 0 -10px 13px -7px silver, 10px 0 15px -6px #bb6b4e;
                        box-shadow: 0 10px 13px -7px silver, 0 -10px 13px -7px silver, 10px 0 15px -6px #bb6b4e;

              }
              .special_angebot > img{
              /*    width: 343px;
                  height: 232px;*/
                  margin: 0;
              }
                .special_angebot_text{
                    padding: 0;
                    width: 100%;
                }

          }

 /* ============================================================================= Header Mobile */
    .hamburger {
        background: transparent;
        border: 0;
        padding-left: 1rem;
        cursor: pointer;
        /*margin-right: 0;*/
    }

    .hamburger span {
        background: #85847F;
        display: block;
        border-radius: 4px;
        height: 3px;
        width: 2rem;
        margin-bottom: 8px;
    }

    .change.bar1 {
      -webkit-transform: rotate(-45deg) translate(-9px, 6px);
   -ms-transform: rotate(-45deg) translate(-9px, 6px);
       transform: rotate(-45deg) translate(-9px, 6px);
    }

    .change.bar2 {
        background: transparent
    }

    .change.bar3 {
      -webkit-transform: rotate(45deg) translate(-8px, -8px);
    -ms-transform: rotate(45deg) translate(-8px, -8px);
        transform: rotate(45deg) translate(-8px, -8px);
    }
    .nav{
        text-align: left;
        -webkit-box-shadow: 0 10px 13px -7px silver;
         box-shadow: 0 10px 13px -7px silver;
    }
    .navi_level2{
        padding: 0.5rem 0 0.5rem 3.5rem;
    }
    .navi_mobile{
        width: 100%;
    }
    .navi_level2 a{
        color: #85847F;
    }
    .navi_level2 img {
        display: inline-block;
        padding-right: 2rem;
    }

    /* =============================================================================
         Header Desktop*/
    @media screen and (min-width: 1025px) {
        .menu {
          display: -webkit-box;
                      display: -ms-flexbox;
                      display: flex;
                    -ms-flex-wrap: wrap;
                        flex-wrap: wrap;
                    -ms-flex-pack: distribute;
                        justify-content: space-around;
                    -webkit-box-shadow: 0 10px 13px -7px silver;
                            box-shadow: 0 10px 13px -7px silver;
                    padding: 0.5rem 0;
                    height: auto;
        }

        .menu li {
            width: auto;
            margin: 0 1rem;
            padding: 1rem 0;
        }

        ul.menu li a {
            color: #85847F;
            font-size: 20px;
        }
    }


    /* =============================================================================
         Footer Mobile  */
    footer {
        padding-top: 2rem;
        text-align: center;
    }

    .footer {
        background-color: #f6ddcc ;
        padding: 1rem 0;
    }

    .footer li {
        width: auto;
        margin: 0.5rem 1rem;
    }

    ul.footer li a {
        color: #bb6b4e;
    }

    ul.footer li img{
        margin: 16px 32px;
        display: inline-block;
    }

    .footer_under {
      padding: 1rem;
      background-color: #FFFFFF;
    }
    .footer_under img{
        height: 3rem;
    }
    .footer_under-logo {
      margin: 1rem;
    }
    #info {
      cursor: pointer;
     }
    /* =============================================================================
        Footer Tablet*/
    @media screen and (min-width: 768px) and (max-width: 1024px) {
      .footer_under{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
        -ms-flex-pack: distribute;
            justify-content: space-around;
      }
      .footer_under-logo {
        width: 25%;
      }
        .footer_under img{
            height: auto;
        }
        }
    /* =============================================================================
         Footer Desktop*/
    @media screen and (min-width: 1025px) {

        .footer {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -ms-flex-pack: distribute;
          justify-content: space-around;
        }

        .footer__menu {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-orient: horizontal;
          -webkit-box-direction: normal;
              -ms-flex-direction: row;
                  flex-direction: row;
        }
        .footer_under{
            padding-top: 3rem;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-orient: horizontal;
          -webkit-box-direction: normal;
              -ms-flex-direction: row;
                  flex-direction: row;
          -ms-flex-pack: distribute;
              justify-content: space-around;
        }
        .footer_under-logo {
          width: 25%;
        }
        .footer_under img{
            height: 5rem;
        }
    }

    /* =============================================================================
         Subsite-Angebote-Mobile */
    .wrapper__angebote {
        margin: 0 auto;
    }

    .wrapper__content {
        text-align: center;
        margin: 1.5rem 0;
        /*padding: 2.5rem;*/
    }
/*    .wrapper__content p {
        text-align: left;
    }*/

    .angebote__image {
      padding: 10px 10px 50px 10px;
             margin: 0;
             background-color: white;
             -webkit-box-shadow: 0 1px 20px 2px silver;
                     box-shadow: 0 1px 20px 2px silver;
    }

    /* =============================================================================
       Seite Angebot Tablet
    @media screen and (min-width: 768px) and (max-width: 1024px) {


    }*/
    /* =============================================================================
              Subsite-Angebote-Desktop*/
    @media screen and (min-width: 1025px) {
        .wrapper__angebote {
          margin: 48px 16px;
          text-align: left;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-orient: horizontal;
          -webkit-box-direction: normal;
              -ms-flex-direction: row;
                  flex-direction: row;
        }

        .wrapper__content {
          text-align: left;
          padding: 2.5rem 4.5rem 2.5rem 2.5rem;
          background-color: #FFFFFF;
          -webkit-box-shadow: 5px 10px 10px 10px silver;
                  box-shadow: 5px 10px 10px 10px silver;
        }

        .aside {
            text-align: center;
            min-width: 30%;
        }
        .angebote__image {
            width: 393px;
            height: auto;
        }
        .img_rotate {
          margin: 2.5rem 0;
          -webkit-transform: rotate(-6deg);
              -ms-transform: rotate(-6deg);
                  transform: rotate(-6deg);
        }

        .img_rotate1 {
          -webkit-transform: rotate(6deg);
              -ms-transform: rotate(6deg);
                  transform: rotate(6deg);
          margin: 2.5rem 0;
        }

        /* Button Booking_Date*/
        .wrapper__angebote a {
            margin-bottom: 5rem;
        }
    }
    /* =============================================================================
         About-Me-Mobile */
    /* =============================================================================
              About-Me-Desktop */
    @media screen and (min-width: 1025px) {
      .aside_aboutme{
          min-width: 30%;
       }
       .aside_aboutme >img{
           width: 392px;
           height: auto;
        }
    }


    /* =============================================================================
         Subsite-Preise-Mobile */
    .page_preise {
        padding: 0.5rem;
        margin: 1.5rem 0;
        background: #FFFFFF url("logos/D-logo.jpg") no-repeat center;
        background-size: 60%;
        box-shadow: -0 15px 15px 0 silver;
        text-align: center;
    }
    .page_preise h2{
        text-align: center;
    }
.page_preise span:last-child{
    color:#bb6b4e;
}
.preise{
  padding: 1rem;
  margin: 0;
  background-color: white;
  -webkit-box-shadow: 0 1px 20px 2px silver;
          box-shadow: 0 1px 20px 2px silver;
  text-align: right;
}
.preise span:last-of-type {
        color: #bb6b4e;
    }


    /* =============================================================================
       Preise Tablet */
    @media screen and (min-width: 768px) and (max-width: 1024px) {
      .page_preise {
          text-align: center;
      }
    }

    /* =============================================================================
              Preise-Desktop*/
    @media screen and (min-width: 1025px) {
        .page_preise {
          -webkit-box-shadow: 5px 10px 10px 10px silver;
                  box-shadow: 5px 10px 10px 10px silver;
          text-align: center;
        }
        .preis {
            display: block;
            position: absolute;
            margin-left: 82%;
            margin-top: 55%;
        }

        .preise {
            font-size: 24px;
            padding: 1rem;
            margin: 0;
            background-color: transparent;
            box-shadow: none;
        }

        .preise span:last-of-type {
            color: #bb6b4e;
        }

    }

    /* =============================================================================
              Kontakt-Mobile */
.wrapper_kontakt{
    text-align: center;
}

    .map {
      -webkit-box-shadow: -0 15px 15px 0 silver;
              box-shadow: -0 15px 15px 0 silver;
      margin: 6rem 0 3rem 0;
    }

    .socialmedia img{
        margin: 16px;
        display: inline-block;
    }

    /* =============================================================================
       KOntakt Tablet */
    @media screen and (min-width: 768px) and (max-width: 1024px) {
        .wrapper_kontakt{
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-orient: horizontal;
          -webkit-box-direction: reverse;
              -ms-flex-direction: row-reverse;
                  flex-direction: row-reverse;
          -webkit-box-pack: justify;
              -ms-flex-pack: justify;
                  justify-content: space-between;
        }

        .adress {
            text-align: right;
        }
        .socialmedia img{
            margin: 16px 32px;
            display: block;
        }
    }
    /* =============================================================================
              KOntakt-Desktop*/
    @media screen and (min-width: 1025px) {
        .wrapper_kontakt{
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-orient: horizontal;
          -webkit-box-direction: reverse;
              -ms-flex-direction: row-reverse;
                  flex-direction: row-reverse;
          -webkit-box-pack: justify;
              -ms-flex-pack: justify;
                  justify-content: space-between;
          margin: 48px 32px;
        }
        .adress {
            text-align: right;
        }
      ul.wrapper_kontakt li img{
            display: inline-block;
        }
    }
    /* =============================================================================
        Buttons Mobile */
    .button {
        height: auto;
        display: block;
        border: none;
        text-decoration: none;
        text-align: center;
        padding: 0.75rem 0;
        width: 12rem;
    }
    .button__orange {
        background-color:#bb6b4e;
        color: white;
    }
.button__white {
    background-color:white;
    border: 1px solid #bb6b4e;
    color: #bb6b4e;
    width: 12rem;
    margin: 1rem auto;
    padding: 0.5rem;
}

.stone_list{
  display: inline;
  vertical-align: middle;
}
    /* =============================================================================
         Button-TerminBuchen-Mobile */
    .booking_date {
      display: -webkit-box;
       display: -ms-flexbox;
       display: flex;
       -webkit-box-orient: vertical;
       -webkit-box-direction: normal;
           -ms-flex-direction: column;
               flex-direction: column;
       width: 12rem;
       -webkit-box-shadow: -5px -5px 10px silver;
               box-shadow: -5px -5px 10px silver;
       margin: 3rem auto;
    }

    .diamant {
        margin-top: 0;
        width: 100%;
        height: auto;
    }


    /* =============================================================================
        Buttons Desktop */
    @media screen and (min-width: 1025px) {
        .button {
            height: auto;
            width: 12rem;
            border: none;
            text-decoration: none;
            text-align: center;
            cursor: pointer;
        }

        .button__orange:hover {
            box-shadow: 6px 10px 3px 0 #bb6b4e;
        }
     /* Button-TerminBuchen-Desktop */
        .booking_date {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            background-color: #FADBC6;
            width: 12rem;
            -webkit-box-shadow: -5px -5px 10px silver;
                    box-shadow: -5px -5px 10px silver;
            margin-left: auto;
            margin-right: auto;
        }

        .diamant {
            margin-top: 0;
            width: 100%;
            height: auto;
        }
        .button__white {
            background-color:white;
            border: 1px solid #bb6b4e;
            color: #bb6b4e;
        }
    }


/*===================================================================================
galerie*/

.item {

    margin: 1rem auto;

}
.item img{
  max-width:100%;
    padding: 10px 10px 50px 10px;
           margin-bottom: : 1rem;
           background-color: white;
           -webkit-box-shadow: 0 1px 20px 2px silver;
                   box-shadow: 0 1px 20px 2px silver;

}

@media screen and (min-width: 768px) and (max-width: 1024px) {
  /*
.item {
    background: #fff;
    margin: 1rem auto;
    width: 100%;
    box-shadow: 2px 2px 4px 0 #ccc;
}*/
    .masonry {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
        -webkit-column-gap: 1rem;
        -moz-column-gap: 1rem;
        column-gap: 1rem;
        margin: 1.5rem;
        padding: 1rem;
        -moz-column-gap: 1.5rem;
        -webkit-column-gap: 1.5rem;
        column-gap: 1.5rem;
    }
}

@media screen and (min-width: 1025px) {
  /*
.item {
    background: #fff;
    margin: 1rem auto;
    width: 100%;
    box-shadow: 2px 2px 4px 0 #ccc;
}*/
    .masonry {
        -webkit-column-count: 3;
        -moz-column-count: 3;
        column-count: 3;
        -webkit-column-gap: 1rem;
        -moz-column-gap: 1rem;
        column-gap: 1rem;
        margin: 1.5rem;
        padding: 1.5rem;
        -moz-column-gap: 1.5rem;
        -webkit-column-gap: 1.5rem;
        column-gap: 1.5rem;
    }
}



.active, .btn:hover {
    color: #bb6b4e;
}