@charset "utf-8";
/* CSS Document */
@font-face {
    font-family: 'BebasNeueRegular';
    src: url('fonts/BebasNeue-webfont.eot');
    src: url('fonts/BebasNeue-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/BebasNeue-webfont.woff') format('woff'), url('fonts/BebasNeue-webfont.ttf') format('truetype'), url('fonts/BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
*, :after, :before {
    box-sizing: border-box
}
:root {
    font-size: 16px;
}
body, html {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    color: #333333;
    font-family: roc-grotesk, -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif;
    font-weight: 300;
}
a:active {
    background: none;
}
a:visited, a:link {
 color:;
    text-decoration: none;
}
p {
    line-height: 1.4;
}
h1 {
    /*color: #8B7E74;*/
    color: #998D85;
    font-family: kudryashev-d-excontrast-sans, sans-serif;
    font-weight: 600;
    line-height: 1.2;/*font-size: 2vw;
    font-size: clamp(2rem, 2vw, 2.5rem);*/
}
h2 {
    font-weight: 100;
    font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
    letter-spacing: 0.08em;
    color: #998D85;
}
h3 {
    line-height: 2;
    font-weight: 300;
}
h4 {
    font-weight: 400;
}
h5 {
    font-weight: 600;
}
h6 {
    font-size: 15px;
}
hr {
    margin: 2rem 0;
    border: 0.1px dotted #666
}
.center {
    text-align: center;
}
strong {
    font-weight: 600;
}
mark {
    background: yellow;
    padding: 6px 0;
}
.cb-slideshow1 li span, .cb-slideshow li span, figure.figure_box_right, .wrapper div, img {
    filter: sepia(0.15) grayscale(0.2) contrast(1.1) brightness(0.9);
}
/*
.cursor {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    pointer-events: none;
    z-index: 3;
}
.cursor__inner {
    fill: var(--cursor-fill);
    stroke: var(--cursor-stroke);
    stroke-width: var(--cursor-stroke-width);
 --cursor-stroke: #333;
 --cursor-fill: none;
 --cursor-stroke-width: 1px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
*/
header img, button img {
    width: 100%;
    height: auto;
}
.row_2 img, figure.row img, figure.row_3_1 img, .fig_bottom_small img {
    width: 100%;
    height: auto;
    border: 0.063rem solid dimgray;
}
section.berge img, .cascade img, figure.figure_left img, article.highlights img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.button {
    position: fixed;
    width: 100px;
    height: 80px;
    top: 50%;
    margin-top: -40px;
    right: 0;
    /*background-image: url("../images/verschiedens/fotoapp.png");*/
    background-repeat: no-repeat;
    background-color: #998D85;
    z-index: 1;
    transition: all 0.4s;
}
.button a {
    color: #ffffff;
}
.button:hover {
    transition-timing-function: ease;
    width: 220px;
    height: 80px;
}
.button p {
    opacity: 0;
    position: absolute;
    top: 30px;
    right: 9px;
    width: 120px;
    text-align: center;
}
.button:hover p {
    transition-delay: 0.4s;
    opacity: 1;
}
.fa-camera {
    color: #EEEEEE;
    font-size: 75px;
    padding: 8px;
    margin-left: 10px;
}
.vl_1 {
    position: absolute;
    border-left: 0.05rem solid #333;
    height: 3.125rem;
    width: 0.06rem;
    left: 50%;
    bottom: 0;
}
.vl {
    border-left: 0.8px solid #333;
    height: 2.5rem;
    width: 0.05rem;
    margin-left: 50%;
    margin-top: 1.3rem;
    margin-bottom: 1.3rem;
}
.vl_2 {
    border-left: 0.05rem solid #333;
    height: 3rem;
    width: 0.05rem;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
}
header {
    position: fixed;
    height: 3.75rem;
    width: 100%;
    z-index: 2;
    top: 0;
    border-bottom: 0.05rem dotted #696969;
    background-color: #FFFFFF;
}
.logo {
    width: 8rem;
    left: 8%;
    position: absolute;
    padding-top: 0.05rem;
    display: block;
}
.sprache {
    width: 4rem;
    right: 8%;
    position: absolute;
    top: 1.375rem;
    color: dimgray;
    word-spacing: 0.5em;
    display: inline-block;
    text-align: right;
    z-index: 2;
    background: none;
    border: none;
}
.sprache a {
    color: #333333;
}
.btn {
    display: inline-block;
    font-size: 1rem;
    font-weight: 400;
    width: 9rem;
    color: #585858;
    padding: 0.4em;
    text-decoration: none;
    text-align: center;
    margin-top: 3rem;
    border: solid 0.05em dimgray;
    margin-bottom: 3rem;
    background-color: transparent;
    cursor: pointer;
}
.btn:hover, .btn_grey:hover {
    background: #DFDFDF;
    text-decoration: none;
}
.btn a {
    color: dimgray;
}
.btn_grey {
    display: inline-block;
    font-size: 1rem;
    font-weight: 400;
    width: 9rem;
    color: #585858;
    padding: 0.4em;
    text-decoration: none;
    text-align: center;
    margin-top: 3rem;
    border: solid 0.05em dimgray;
    margin-bottom: 3rem;
    background-color: #EEEEEE;
    cursor: pointer;
}
.btn_storno {
    display: inline-block;
    font-size: 1rem;
    font-weight: 400;
    width: 13.5rem;
    color: #585858;
    padding: 0.4em;
    text-decoration: none;
    text-align: center;
    margin-top: 3rem;
    border: solid 0.05em dimgray;
    margin-bottom: 3rem;
    background-color: transparent;
    cursor: pointer;
}
.btn_storno:hover, .btn_grey:hover {
    background: #DFDFDF;
    text-decoration: none;
}
.btn_storno a {
    color: dimgray;
}
.btn--buchen {
    display: inline-block;
    margin: 0 0.625rem;
    font-size: 1.0rem;
    font-weight: 400;
    width: 9rem;
    color: #ffffff;
    padding: 0.4em;
    text-decoration: none;
    text-align: center;
    margin-top: 3rem;
    border: solid 0.05em dimgray;
    margin-bottom: 3rem;
    background-color: #998D85;
    cursor: pointer;
}
.btn--buchen:hover {
    background: #AEA49E;
    text-decoration: none;
}
.btn--buchen a {
    color: #ffffff;
}
/*Circle */

.circle {
    height: 11.25rem;
    width: 11.25rem;
    text-align: center;
    line-height: 12.5rem;
    color: white;
    border-radius: 50%;
    border: 0.125rem solid #998D85;
    background: radial-gradient(circle at center, #998D85 66.5%, transparent 68%);
    position: absolute;
    top: 25%;
    left: 10%;
    cursor: pointer;
}
.circle:hover {
    height: 12.5rem;
    width: 12.5rem;
}
.circle {
    float: left;
    margin-right: 0.6rem;
    transition: all 1s;
}
.circle p:hover {
    height: 12.5rem;
    width: 12.5rem;
}
.circle p {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 11.25rem;
    height: 11.25rem;
    font-size: 0.9rem;
    line-height: 1.6rem;
    color: #fff;
    transition: all 1s;
}
.scroll_circle {
    height: 5rem;
    width: 5rem;
    text-align: center;
    line-height: 12.5rem;
    color: white;
    border-radius: 50%;
    border: 0.13rem solid #998D85;
    background: radial-gradient(circle at center, #998D85 66.5%, transparent 68%);
    position: absolute;
    bottom: 3.125rem;
    left: 50%;
    margin-left: -2.5rem;
    transition: all 1s;
    cursor: pointer;
}
.scroll_circle:hover {
    transform: scale(1.1);
}
.scroll_circle p {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 5rem;
    height: 5rem;
    font-size: 0.6rem;
    color: #fff;
    transition: all 1s;
}
/*Ende Circle*/
.container {
 height: calc(var(--vh, 1vh) * 100);
    margin: auto;
    position: relative;
    min-height: 25rem;
    background-color: #F4F2F2;
}
.container_grey {
    position: relative;
    background-color: #F4F2F2;
}
main.content {
    margin: 0 auto;
    padding-top: 3.75rem;
    background-color: #EEEEEE;
    max-width: 95rem;
}
main.content-1 {
    margin: 0 auto;
    padding-top: 3.75rem;
    background-color: #EEEEEE;
}
main.content-2 {
    margin: 0 auto;
}
main.content-3 {
    margin: 0 auto;
    background-color: #EEEEEE;
    padding-top: 3.75rem;
    padding-bottom: 3.75rem;
}
main.content-4 {
    margin: 0 auto;
    padding: 3.75rem 1.25rem;
    line-height: 1.2;
}
main.content-4 a {
    font-weight: 600;
    color: #333;
}
main.content-4 a:hover {
    font-weight: 600;
    color: #B4B4B4;
}
section.leistungen {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    background: #FFFFFF;
}
article.cascade {
    flex-basis: 50%;
 height: calc(var(--vh, 1vh) * 100);
    display: flex;
    flex-grow: 1;
    position: relative;
    min-height: 70rem;
}
article.cascade div:nth-of-type(1) {
    flex-basis: 25%;
    min-width: 3rem;
}
article.cascade div:nth-of-type(2) {
    flex-basis: 75%;
    background: #EEEEEE;
    padding-top: 10%;
    padding-left: 2.5rem;
    padding-right: 1.25rem;
    min-width: 1rem;
}
article.angebot {
    flex-basis: 50%;
    padding-top: 8%;
    padding-left: 3rem;
    padding-right: 1.3rem;
    flex-grow: 1;
    height: auto;
}
.figure_bottom {
    position: absolute;
    width: 100%;
    height: 40%;
    bottom: 6%;
    z-index: 1;
}
article.angebot p, article.cascade p {
    margin-top: 3rem;
    line-height: 2rem;
    max-width: 37rem;
}
h1.main_title {
    color: #998D85;
    font-family: kudryashev-d-excontrast-sans, sans-serif;
    font-weight: 600;
    line-height: 1.5;
    padding: 0 1.25rem;
    margin-top: rem;
    text-align: center;
}
h1.main_title_info {
    color: #998D85;
    font-family: kudryashev-d-excontrast-sans, sans-serif;
    font-weight: 600;
    line-height: 1.5;
    font-size: clamp(1.875rem, 3vw, 2.75rem);
}

@media(max-width: 1280px) {
.logo {
    left: 50%;
    margin-left: -4rem;
    z-index: 2;
}
header {
/* position:absolute;Für mobile*/ 
}
.sprache {
    width: 5rem;
    right: 0.75rem;
    word-spacing: 0.6em;
    font-size: 1.1rem
}
}
.cb-slideshow li:nth-child(1) span {
    background-image: url("../../images/slider/1_1.jpg");
    background-image: image-set( url("../../images/slider/1_1.avif") type("image/avif"), url("../../images/slider//1_1.jpg") type("image/jpeg"));
}

@media(max-width: 640px) {
.circle {
    top: 15%;
}
.button {
    display: none;
}
}