

* {
    padding: 0px;
    margin: 0px;
    border-spacing: 0px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    outline: none;
}

html {
    height: 100%;
    -webkit-text-size-adjust: 100%;
    font-size: 10px;
}

body {

   font-family: "Noto Sans", sans-serif;

    font-weight: 300;
    line-height: 160%;
    font-size: 2rem;
    color: #000;
    position: relative;
    min-height: 100%;
    overflow-y: scroll;
    background: #fff;

}

body.fancybox-active {
    overflow: hidden;
    margin-right: var(--sbw);
}


a {
    color: #000;
    text-decoration: none;
    border: 0;
}

a:hover {
    color:#d6327b;
}

b, strong {
    font-weight: 400;
}

p {
    margin-bottom: 1rem;
}

p.no_mb, p:last-child {
    margin-bottom: 0;
}

p.lil_gap {
    margin-bottom: 1rem;
}

p.big_gap {
    margin-bottom: 3.5rem;
}


small, .small {
    font-size: 90%;
}

.big {
    font-size: 112%;
}

.hinweis {
    font-size: 80%;
    font-style: italic;
}


.hidden, #mmenu, #rmenu, .sh_smpt, .visually-hidden, #header .instagram {
    display: none;
}

.sh_smpt {
    display: none !important;
}

#wrapper {
    position: relative;
    width: 100%;
    margin: 0 auto;
    height: auto;
    min-height: 100%;
    background: #fff;
}




#header {
    position: relative;
    width: 160rem;
    height: 18rem;
    margin: 0 auto;
}



#header #logo {
    width: 15.2%;
    height: 8.4rem;
    position: absolute;
    z-index: 10;
    right: 0; 
    top: 2.4rem;
    color: #fff;
}

#header #logo img {
    display: block;
    height: auto;
    width: 100%;

}




ul#menu {
    list-style: none;
    display: flex;
    position: absolute;
    align-items: center;
    left: 0;
    top: rem;
    height: 4rem;
}

ul#menu li {
  margin-right: 3.2rem;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 2.3rem;
  height: 4rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #ddd;
  width: 18.56rem;
}

ul#menu li:first-child {
    background: #d6327b;
    color: #fff;
    font-weight: 700;
}


#topmenu ul {
    height: 4rem;
    position: absolute;
    left: 0;
    width: 126rem;
    bottom: 7rem;
    display: flex;
    justify-content: space-between;
    list-style: none;

}

#topmenu ul li  {
    height: 4rem;
}

#topmenu ul li a {
    display: block;
    position: relative;
    height: 4rem;
    line-height: 4rem;
              font-family: "brandon-grotesque", sans-serif;
              font-weight: 700;
              font-size: 2.7rem;
              text-transform: uppercase;
              
}

#topmenu ul li a:before {
    position: absolute;
    content: '';
    width: 5.5rem;
    height: 3.96rem;
    left: -2.5rem;
    background: url(../images/biene.svg) center center;
    background-size: cover;
    top: -2rem;
    opacity: 0;
    pointer-events: none;
    transform: translateX(-0.6rem);
    transition: all 0.2s ease-out;
}

#topmenu ul li.active a:before, #topmenu ul li a:hover:before  {
    opacity: 1;
    transform: translateX(0);    
}

#topmenu ul li.active a, #topmenu ul li a:hover  {
    color:#d6327b;
}


#slider {
    position: relative;
    width: 160rem;
    height: 50rem;

    margin: 0 auto;
} 

#slider_image {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 66%;
        background: #eee;
    background: url(../images/w1200_h815_x600_y407_WES_Bislicher_Landfrauen-03fc27883411fb85.jpg) center center;
    background-size: cover;
}

#slider_text {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 32%;
    background: #007ac3;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: #fff;
    text-transform: uppercase;
    font-size: 5.2rem;
    line-height: 130%;
    font-weight: 700;
      font-family: "brandon-grotesque", sans-serif;
}

#content {
    width: 160rem;
    position: relative;
    margin: 0 auto;
    box-sizing: border-box;

    padding-bottom: 17rem;
    margin-top: 4rem;
}

#columns {
    display: flex;
    justify-content: space-between;
}

#columns > div {
    width: 32%;
}

#columns2 {
    display: flex;
    justify-content: space-between;
}

#columns2 > div:first-child {
    width: 66%;
}

#columns2 > div:last-child {
    width: 32%;
}

#columns2 > div:first-child h3 {
    margin-top: 0rem;
}

.highlight {
    border: 1px solid #ccc;
    box-sizing: border-box;
    padding: 1.5rem;
}

#columns2 .highlight {
    padding: 3rem;
}

.highlight .image {
    height: 0;
    padding-bottom: 66%;
    background: #eee;
    margin-bottom: 4rem;
    background: url(../images/temp/1000_F_55008546_yCHnPYJ2krAtchdapQBFcjQ0F9RbrdFf.jpg) center center;
    background-size: cover;
}

.highlight.baeckerei .image {
    background: url(../images/temp/1000_F_861147915_Tw2PoZqKwbOuW6yvzcMvd71fiTBOYoB5.jpg) center center;
}

.highlight .more {
    font-weight: 400;
    position: relative;
    padding-left: 2rem;
}

.highlight .more:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0.9rem;
    border-left: 1rem solid #d6327b;
    border-top: 0.7rem solid transparent;
    border-bottom: 0.7rem solid transparent;
}

.termine .more {
    font-weight: 400;
    position: relative;
    padding-left: 2rem;
    display: inline-block;
}

.termine .more:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 1rem;
    border-left: 1rem solid #fff;
    border-top: 0.7rem solid transparent;
    border-bottom: 0.7rem solid transparent;
}


.termine {
    box-sizing: border-box;
    background:#d6327b;
    padding: 1.5rem;
    color: #fff;
    font-weight: 400;
    position: relative;
    padding-bottom: 7rem;
}

.termin {
    background: rgba(0,0,0,0.1);
    padding: 1.5rem;
    text-align: center;
    border: 1px solid #fff;
    box-sizing: border-box;
    margin-bottom: 1.5rem;
}
.background_text {
    padding: 3rem 5rem;
    background: rgba(255,255,255,0.95);
}

.alle_termine {
        font-size: 3.1rem;
    text-transform: uppercase;
  font-weight: 400;
  font-weight: 700;
    margin-bottom: 3rem;
    color: #fff;
    text-align: center;
    margin-top: 0.5rem;
    position: absolute;
    bottom: 2rem;
    left: 1.5rem;
    right: 1.5rem;
}

.headline {
    display: block;
    height: 19.5rem;
    width: auto;
    margin-bottom: 3rem;
}

h1 {
    font-size: 5rem;
    font-weight: 400;
    color: #fff;
    background: rgba(192,66,43,0.95);
    margin-left: -3rem;
    margin-right: -3rem;
    padding-left: 8rem;
    height: 8.5rem;
    line-height: 8.2rem;
}

h2 {
      font-family: "brandon-grotesque", sans-serif;
    font-size: 3.3rem;
text-transform: uppercase;
  font-weight: 400;
  font-weight: 700;
    margin-bottom: 3rem;
    color: #fff;
    text-align: center;
    margin-top: 0.5rem;
}

.termine h2 {
    line-height: 125%;
        margin-bottom: 2rem;
}
h3 {
      font-family: "brandon-grotesque", sans-serif;
    font-size: 3.4rem;
    font-weight: 400;
    margin-bottom: 1.2rem;
    color: #000;
    color:#d6327b;
text-transform: uppercase;
  font-weight: 400;
  font-weight: 700;
}

.termine h3 {
    color: #fff;
    font-size: 3.2rem;;
}

h4 {
      font-family: "brandon-grotesque", sans-serif;
    font-size: 3rem;
    font-weight: 400;
    margin-bottom: 1.2rem;
    color: #000;
    color:#d6327b;
text-transform: uppercase;
  font-weight: 400;
  font-weight: 700;
}

#instagram {
    display: inline-block;
    width: 3.6rem;
    height: auto;
    margin-top: 1.5rem;
}

#instagram:hover {
    filter: brightness(0) saturate(100%) invert(48%) sepia(61%) saturate(6944%) hue-rotate(313deg) brightness(87%) contrast(92%);
}

a.button {
    height: 3.6rem;
    line-height: 3.6rem;
    display: inline-block;
    padding-left: 4.5rem;
    position: relative;
    font-size: 2.5rem;
    margin-top: 2rem;
}

a.button:before {
    position: absolute;
    content: '';
    width: 3.6rem;
    height: 3.6rem;
    left: 0;
    top: 0;
    background: url(../images/blume.svg) center center;
    background-size: cover;
    transition: all 0.2s ease-in;
}

a.button:hover:before {
    transform: scale(1.15);
}

#content ul {
    list-style: none;
}

#content ul.list li {
    padding-left: 1.8rem;
    position: relative;
    text-align: left;
    line-height: 160%;
    margin-bottom: 0.5rem;
}

#content ul.list li:last-child {
    margin-bottom: 0;
}

#content ul.list li:before {
    content: '';
    position: absolute;
    display: block;
    width: 0.7rem;
    height: 0.7rem;
    background: #d6327b;
    left: 0;
    top: 1.4rem;
    border-radius: 0.2rem;
}



.clm2 {
    display: flex;
    justify-content: space-between;

}


.clm2 > div:first-child {
    width: 55%;
}

.clm2 > div:last-child {
    background: url(../images/DSCF7154.jpg);
    background-size: cover;
    background-position: center;
    width: 40%;
}


.sandra {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.sandra > div:first-child {
    width: 64%;
}

.sandra > div:last-child {
    width: 26%;
}

.sandra > div:last-child > div {
    border-radius: 50%;
    overflow: hidden;
}

.sandra > div:last-child img {
    width: 100%;
    height: auto;
    display: block;
} 

 
.infobox {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 4rem;
}

.infobox > div {
    width: 45%;
    border: 1px solid #d9c2a3;
    padding: 4rem 16rem 4rem 4.5rem;
    margin-bottom: 5%;
    background:#fbf9f6;
    box-sizing: border-box;
    position: relative;
    border-radius: 4rem;
}

.infobox > div:before {
    content: '1';
    position: absolute;
    right: 4rem;
    top: 5.5rem;
    font-size: 12rem;
    color:#d9c2a3;
    opacity: 0.7;
}

.infobox > div:nth-child(2):before {
    content: '2';
}

.infobox > div:nth-child(3):before {
    content: '3';
}

.infobox > div:nth-child(4):before {
    content: '4';
}

.infobox > div:last-child, .infobox > div:nth-last-child(2) {
    margin-bottom: 0;
}





/* Accordion */

.accordion > div {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-in;
    max-height: 0px;
    height: auto;
}

.accordion.open > div {
    max-height: none;
}

.accordion.animating > div, .accordion.open.animating > div {
    max-height: 5000px;
    max-height: var(--acc_height);
}

.accordion > div > div {
    padding: 0.5rem 0 10rem 5.8rem;
}

.accordion > a {
    display: block;
    width: 100%;
    border: none;
    cursor: pointer;
    padding: 0;
    text-align: left;
}

.accordion.open > a, .accordion.animating > a, .accordion.open.animating > a {

}


.accordion h2 {
    position: relative;
    text-align: left;
    margin-bottom: 4rem;
    padding-left: 5.8rem;
    text-align: left;
    font-weight: 400;
    line-height: 130%;
    text-wrap: balance;
}

.accordion h2 > span {
    position: absolute;
    left: 0;
    top: 0.2rem;
    width: 4.2rem;
    height: 4.2rem;
    background: #ecdcc5;
    border-radius: 50%;
    transition: transform 0.15s ease-out;
}


.accordion h2 span:before {
    content: '';
    display: block;
    position: absolute;
    height: 0.6rem;
    width: 2.6rem;
    left: 0.8rem;
    top: 1.8rem;
    background: #fff;
    transition: transform 0.2s ease-in;
    border-radius: 0.3rem;
}

.accordion.open h2 span:before, .accordion.animating h2 span:before {
   transform: rotate(-180deg);

}

.accordion h2 span:after {
    content: '';
    display: block;
    position: absolute;
    width: 0.6rem;
    height: 2.6rem;
    top: 0.8rem;
    left: 1.8rem;
    background: #fff;
    transition: transform 0.2s ease-in;
    border-radius: 0.3rem;
}

.accordion.open h2 span:after, .accordion.animating h2 span:after {
   transform: rotate(-90deg);
}






ul.zertifikate {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

ul.zertifikate li {
    margin-bottom: 1rem;
    width: 45%;
    display: block;
}

ul.zertifikate li:nth-child(1) { order: 1;}
ul.zertifikate li:nth-child(2) { order: 3;}
ul.zertifikate li:nth-child(3) { order: 5;}
ul.zertifikate li:nth-child(4) { order: 7;}
ul.zertifikate li:nth-child(5) { order: 2;}
ul.zertifikate li:nth-child(6) { order: 4;}
ul.zertifikate li:nth-child(7) { order: 6;}


ul.zertifikate li a {
    padding-left: 4rem;
    position: relative;
    display: inline-block;
}

ul.zertifikate li a:before {
    content: 'PDF';
    position: absolute;
    display: block;
    left: 0;
    top: 0.4rem;
    width: 3rem;
    height: 3rem;
    background: #ecdcc5;
    border-radius: 50%;
    color: #fff;
    line-height: 3rem;
    text-align: center;
    font-size: 1.4rem;
    transition: all 0.2s ease-in; 
}

ul.zertifikate li a:hover:before {
    transform: scale(1.15);
}





.gallery {
    display: flex;
    flex-wrap: wrap;
    margin-top: 5rem;
}

.gallery > div {
    width: 17.8%;
    height: 17.8%;
    margin-right: 2.75%;
    margin-bottom: 2.75%;
    border-radius: 4rem;
    overflow: hidden;
}

.gallery > div:nth-child(5n) {
    margin-right: 0;
}

.gallery > div > a {
    display: block;
    position: relative;
    height: 0;
    padding-bottom: 100%;
}

.gallery > div > a > span {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.gallery > div > a > span:before {
    content: '';
    display: block;
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #d9c2a3;
    opacity: 0;
    transition: all 0.2s ease-in;
}

.gallery > div > a:hover > span:before {
    opacity: 0.65;   
}

.gallery > div > a > img {
    display: block;
    position: relative;
    z-index: 1;
    width: 100%;
    height: auto;
    transition: all 0.2s ease-in;
}

.gallery > div > a:hover > img {
    transform: scale(1.15);
}

.gallery > div > a > span:after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: url(../images/icon_lupe.svg) center center no-repeat;
    background-size: 20% auto;
    opacity: 0;
    transform: translateX(3.5%);
    transition: all 0.3s ease-out;
    z-index: 3;
}

.gallery > div > a:hover > span:after {
    transform: translateX(0);
    opacity: 1;
}


.fancybox-caption {
	font-size: 2rem !important;
}







  #contact {
    width: 100%;
    position: relative;
    background:#ecdcc5;
    margin: 45rem 0;
  }

  #contact:before, #contact:after {
    content: '';
    position: absolute;
    display: block;
    width: 30rem;
    height: 15rem;
    left: 50%;
    transform: translateX(-50%);
    top: -15.7rem;
    background: url(../images/blume.svg) center top;
    background-size: cover;
  }

  #contact:after {
    top: auto;
    bottom: -15.7rem;
    transform: translateX(-50%) rotate(180deg);
  }


#contact > div {
    width: 160rem;
    margin: 0 auto;
    padding: 8rem 0;
    position: relative;
}

#contact > div > div {
    padding: 4rem;
    background: rgba(255,255,255,0.6);
    /* color: #473929; */
    text-align: center;
    border-radius: 4rem;
}

#contact .instagram {
    display: block;
    margin: 0 auto;
    margin-top: 3rem;
    width: 3.4rem;
}

#contact .instagram img {
    display: block;
    margin: 0 auto;
    width: 3.4rem;
    height: auto;
}





#teaser_menu {
    width: 160rem;
    margin: 0 auto;
    padding-bottom: 47rem;
}

#teaser_menu > div {
    display: flex;
    justify-content: space-between;
}

#teaser_menu > div > p {
    display: block;
    margin: 0;
    width: 15.5%;
}

#teaser_menu > div > p > a {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 2.4rem;
    line-height: 140%;
}

#teaser_menu > div > p > a > span:first-child {
    width: 100%;
    height: 70rem;
    margin-bottom: 3rem;
    position: relative;
    overflow: hidden;
    border-radius: 4rem;
    display: block;
}

#teaser_menu > div > p > a > span:first-child:before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 10;
    opacity: 1;
    transition: all 0.2s ease-in;
}

#teaser_menu > div > p > a:hover > span:first-child:before {
    opacity: 0.4;
}

#teaser_menu > div > p > a > span:first-child > span {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #ddd;
    background: url(../images/teaser_menu.jpg);
    background-size: 160rem auto;
    transition: all 0.2s ease-in;
    display: block;
}

#teaser_menu > div > p:nth-child(1) > a > span:first-child > span {
    background-position: 0 center;
}

#teaser_menu > div > p:nth-child(2) > a > span:first-child > span {
    background-position: -27rem center;
}

#teaser_menu > div > p:nth-child(3) > a > span:first-child > span {
    background-position: -54rem center;
}

#teaser_menu > div > p:nth-child(4) > a > span:first-child > span {
    background-position: -81rem center;
}

#teaser_menu > div > p:nth-child(5) > a > span:first-child > span {
    background-position: -108rem center;
}

#teaser_menu > div > p:nth-child(6) > a > span:first-child > span {
    background-position: -135rem center;
}


#teaser_menu > div > p > a:hover > span:first-child > span {
    transform: scale(1.15);
}

#teaser_menu > div > p > a > span:last-child {
    display: inline-block;
    position: relative;
    height: 3.6rem;
    line-height: 3.6rem;
    transition: all 0.2s ease-in;
}

#teaser_menu > div > p > a.active > span:last-child, #teaser_menu > div > p > a:hover > span:last-child {
    padding-left: 4.4rem;
} 

#teaser_menu > div > p > a > span:last-child:before {
    position: absolute;
    content: '';
    width: 3.6rem;
    height: 3.6rem;
    left: 0;
    background: url(../images/blume.svg) center center;
    background-size: cover;
    top: 0;
    opacity: 0;
    transition: all 0.2s ease-in;
} 

#teaser_menu > div > p > a.active > span:last-child:before, #teaser_menu > div > p > a:hover > span:last-child:before {
    opacity: 1;
} 

#footer {
    width: 100%;
    height: 10rem;
    line-height: 10rem;
    text-align: center;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background:#ddd;
    color: #fff;
    font-size: 2rem;
    color: #000;
  }

  #footer a {
    color: #fff;
  }

  #footer img {
    display: block;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -15.5rem;
    height: 13rem;
    width: auto;
  }

#kontaktformular {
    display: none;
    width: 100% !important;
    max-width: 60rem !important;
    max-height: calc(100% - 5rem);
}



input, textarea, select, button#bfSubmitButton {
    font-family: 'Arsenal', sans-serif; 
    font-weight: 400;
    font-size: 2.2rem;
    color:  #000;
    padding: 0.5rem 0 0.5rem;
    outline: none;
    box-sizing: border-box;
    background: #fff;
    -webkit-appearance: none;
    border-radius: 0;
    width: 100%;
    background: none;
    border: none;
    border-bottom:  1px solid #000;
}

button#bfSubmitButton {
    cursor: pointer;
    font-weight: 400;
    padding: 0.5rem 1rem 0.5rem;
    background: #d9c2a3;
    color: #fff;
    width: auto;
    border: none;
}

button#bfSubmitButton:hover {
    background: #cfb491;
}


textarea {
    height: 20rem !important;
}

button {
    cursor: pointer;
}

.bfQuickMode .bfElemWrap {
	margin-bottom: 3rem !important;
}

.bfQuickMode .form-inline .form-group, .bfQuickMode .form-inline label, .bfQuickMode .bfbs5-form-inline .bfbs5-form-group, .bfQuickMode .bfbs5-form-inline label {
	margin-right: 0 !important;
}

#bfElemWrap13 {
    position: relative;
    margin-bottom: 0rem !important;
}

#bfLabel13 {
    padding-left: 3.1rem;
    line-height: 130%;
}

input[type="checkbox"].ff_elem {
    position: absolute !important;
    left: 0;
    top: 0.4rem;
    -moz-appearance: initial;
    visibility: hidden;
    cursor: pointer;
}

input[type="checkbox"].ff_elem:before {
    content: '';
    position: absolute;
    width: 2.2rem;
    height: 2.2rem;
    background: #fff;
    border: 1px solid #000;
    border-radius: 50%;
    left: 0;
    top: 0;
    visibility: visible;
    box-sizing: border-box;
}

input[type="checkbox"].ff_elem:checked:after {
    content: '';
    position: absolute;
    width: 2rem;
    height: 2rem;
    background: url(../images/icon_checked.svg);
    background-size: cover;
    left: 0.1rem;
    top: 0.1rem;
    visibility: visible;
}


.fancybox-can-pan .fancybox-content, .fancybox-can-swipe .fancybox-content {
	cursor: auto !important;
}


