/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------- CSS for Desktop Devices --------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media only screen and (min-width: 1280px) {

    /* comfortaa-regular - latin */
    @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Comfortaa';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/comfortaa-v40-latin-regular.eot'); /* IE9 Compat Modes */
    src: url('../fonts/comfortaa-v40-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/comfortaa-v40-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/comfortaa-v40-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('../fonts/comfortaa-v40-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/comfortaa-v40-latin-regular.svg#Comfortaa') format('svg'); /* Legacy iOS */
    }
  
    /* comfortaa-700 - latin */
    @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Comfortaa';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/comfortaa-v40-latin-700.eot'); /* IE9 Compat Modes */
    src: url('../fonts/comfortaa-v40-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/comfortaa-v40-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/comfortaa-v40-latin-700.woff') format('woff'), /* Modern Browsers */
         url('../fonts/comfortaa-v40-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/comfortaa-v40-latin-700.svg#Comfortaa') format('svg'); /* Legacy iOS */
    }

    @viewport {
        width: device-width;
        zoom: 1;
    }

    html, body {
        height: 100%;
        min-height: 100% !important;
    }

    a:any-link {
        color: #444444;
        text-decoration: none;
    }

    a:visited {
        color: #444444;
        text-decoration: none;
    }
    
    * {
        padding: 0px;
        margin: 0px;
        box-sizing: border-box;
        font-family: 'Comfortaa', sans-serif;
        font-size: 1.0em;
    }

    .general-page-wrapper {
        position: relative;
        height: 100%;
    }
    
    .header-container {
        width: 100vw;
        height: 200px;
        display: flex;
        flex-direction: row;
        position: relative;
        margin-bottom: 20px;
    }

    .header {
        position: relative;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        background: rgb(254,240,253);
        background: radial-gradient(circle, rgba(254,240,253,1) 0%, rgba(254,240,253,0) 95%);
    }

    .upper-container {
        display: flex;
        flex-direction: row;
        align-items: center;
    }
    
    .bef-logo {
        z-index: 100;
        height: 170px;
        border-radius: 25px;
        margin: 15px;
        box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
    }

    .header-text {
        display: flex;
        letter-spacing: 8px;
    }

    .contact-text-container {
        z-index: 100;
        display: flex;
        position: absolute;
        top: 70px;
        right: 70px;
        width: 170px;
        height: 170px;
        justify-content: center;
        align-items: center;
        line-height: 1.5;
        background-color: #b6f0d1;
        border-radius: 170px;
    }

    .contact-text-circle {
        display: flex;
        flex-direction: column;
        text-align: center;
        transform: rotate(25deg);
        visibility: visible;
    }

    .contact-text-rectangle {
        display: none;
        visibility: hidden;
    }

    .home-button-container {
        z-index: 60;
        position: absolute;
        top: 280px;
        right: 0px;
        width: 100px;
        padding: 5px 15px;
        border-top-left-radius: 25px;
        border-bottom-left-radius: 25px;
        background: rgb(254,240,253);
        background: linear-gradient(90deg, rgba(254,240,253,1) 0%, rgba(255,255,255,1) 95%);
    }

    .home-button-arrow {
        font-size: xx-large;
    }

    .page-content-wrapper {
        z-index: 50;
        position: relative;
        height: calc(100vh - 380px);
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        overflow: hidden;
    }
    
    .page-content-container {
        z-index: 50;
        position: relative;
        width: 80%;
        max-width: 80%;
        display: flex;
        flex-direction: row;
        margin-top: 0px;
        justify-content: space-evenly;
        align-content: center;
        overflow-x: scroll;
    }

    .text-container {
        z-index: 0;
        position: relative;
        height: 618px;
        display: flex;
        flex-direction: column;
        width: 50%;
        max-width: 512px;
        /*border-bottom: 2px solid #b6f0d1;*/
    }

    .lower-text-container {
        display: none;
        visibility: hidden;
    }

    .headline-content {
        z-index: 0;
        padding: 0px 25px;
    }

    .text-content {
        z-index: 0;
        color: #444444;
        margin-top: 10px;
        margin-left: 25px;
        margin-right: 25px;
        line-height: 2.0;
    }

    .bef-owner {
        width: 150px;
        position: absolute;
        bottom: 0px;
        right: 40px;
        border: 2px solid #b6f0d1;
        border-radius: 150px;
    }

    .bef-owner-lower {
        display: none;
    }

    .upper-partial-text-content {
        display: flex;
        visibility: visible;
    }

    .lower-partial-text-content {
        display: none;
        visibility: hidden;
    }
    
    .tile-container {
        z-index: 0;
        position: relative;
        height: 618px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-content: center;
        width: 50%;
        max-width: 512px;
    }

    .outer-service-container {
        display: flex;
        flex-direction: column;
    }

    .inner-service-container {
        display: flex;
        flex-direction: row;
    }

    .service-container {
        width: 200px;
        min-width: 200px;
        max-width: 200px;
        height: 150px !important;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        padding: 15px;
        margin: 25px;
        /*border: 3px solid #b6f0d1;*/
        border-radius: 30px;
        /*background-color: #ffecf0;*/
        background-color: rgb(254,240,253);
    }

    .service-container:hover {
        background-color: #b6f0d1;
        transition: 0.7s all ease;
        cursor: pointer;
    }

    .service-logo-container {
        display: flex;
        justify-content: center;
        margin-bottom: 15px;
    }

    .bef-service {
        width: 50%;
        border-radius: 300px;
    }

    .service-description-container {
        display: flex;
        justify-content: center;
    }

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

    .footer {
        z-index: 90;
        position: relative;
        bottom: 0px;
        width: 100%;
        font-size: 0.70rem;
        padding: 20px 30px 20px 30px;
        line-height: 1.6;
        background-color: #ffffff;
    }

    .footer-text {
        color: #aaaaaa;
        padding: 3px 15px;
        display: block;
    }

    .footer-horizontal-rule {
        height: 1px;
        border: none;
        background: #444444;
    }

    .footer-sections-container {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        width: 709px;
    }

    .footer-section-container {
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
        padding: 15px 0 0 0;
        flex-shrink: 0;
    }

    .footer-section-container-title {
        color: #aaaaaa;
        padding: 3px 15px;
        display: block;
        font-weight: bold;
        margin-bottom: 10px;
    }

    .footer-link {
        color: #aaaaaa !important;
        padding: 3px 15px;
        display: block;
        text-decoration: none;
    }

    .footer-link:hover {
        color: #b9c8ff;
        transition: 0.7s all ease;
    }

    .footer-link:visited {
        color: #aaaaaa !important;
        text-decoration: none;
    }

    address {
        color: #aaaaaa;
        padding: 3px 15px;
        display: block;
        text-decoration: none;
    }

    .cookies-note {
        color: #aaaaaa !important;
        padding: 3px 15px;
        display: block;
    }
}

@media only screen and (min-width: 769px) and (max-width: 1279px) {

    /* comfortaa-regular - latin */
    @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Comfortaa';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/comfortaa-v40-latin-regular.eot'); /* IE9 Compat Modes */
    src: url('../fonts/comfortaa-v40-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
            url('../fonts/comfortaa-v40-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
            url('../fonts/comfortaa-v40-latin-regular.woff') format('woff'), /* Modern Browsers */
            url('../fonts/comfortaa-v40-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
            url('../fonts/comfortaa-v40-latin-regular.svg#Comfortaa') format('svg'); /* Legacy iOS */
    }
      
    /* comfortaa-700 - latin */
    @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Comfortaa';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/comfortaa-v40-latin-700.eot'); /* IE9 Compat Modes */
    src: url('../fonts/comfortaa-v40-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
            url('../fonts/comfortaa-v40-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
            url('../fonts/comfortaa-v40-latin-700.woff') format('woff'), /* Modern Browsers */
            url('../fonts/comfortaa-v40-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
            url('../fonts/comfortaa-v40-latin-700.svg#Comfortaa') format('svg'); /* Legacy iOS */
    }

    @viewport {
        width: device-width;
        zoom: 1;
    }
    
    html, body {
        height: 100%;
        min-height: 100% !important;
    }

    a:any-link {
        color: #444444;
        text-decoration: none;
    }

    a:visited {
        color: #444444;
        text-decoration: none;
    }
        
    * {
        padding: 0px;
        margin: 0px;
        box-sizing: border-box;
        font-family: 'Comfortaa', sans-serif;
        font-size: 1.0em;
    }
    
    .general-page-wrapper {
        position: relative;
        height: 100%;
    }
    
    .header-container {
        width: 100vw;
        height: 200px;
        display: flex;
        flex-direction: row;
        position: relative;
        margin-bottom: 70px;
    }

    .header {
        position: relative;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        background: rgb(254,240,253);
        background: radial-gradient(circle, rgba(254,240,253,1) 0%, rgba(254,240,253,0) 95%);
    }

    .upper-container {
        display: flex;
        flex-direction: row;
        align-items: center;
    }
    
    .lower-container {
        display: flex;
        flex-direction: row;
    }
    
    .bef-logo {
        z-index: 100;
        height: 170px;
        border-radius: 25px;
        margin: 15px;
        box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
    }

    .header-text {
        display: flex;
        letter-spacing: 8px;
    }

    .contact-text-container {
        z-index: 100;
        display: flex;
        position: absolute;
        top: 200px;
        right: 0px;
        width: 100%;
        height: 50px;
        justify-content: center;
        align-items: center;
        line-height: 1.5;
        background-color: #b6f0d1;
        border-radius: 0px;
    }

    .contact-text-circle {
        display: none;
        visibility: hidden;
    }

    .contact-text-rectangle {
        display: flex;
        text-align: center;
        visibility: visible;
    }

    .home-button-container {
        z-index: 60;
        position: absolute;
        top: 280px;
        right: 0px;
        width: 100px;
        padding: 5px 15px;
        border-top-left-radius: 25px;
        border-bottom-left-radius: 25px;
        background: rgb(254,240,253);
        background: linear-gradient(90deg, rgba(254,240,253,1) 0%, rgba(255,255,255,1) 95%);
    }

    .home-button-arrow {
        font-size: xx-large;
    }

    .page-content-wrapper {
        z-index: 50;
        position: relative;
        height: fit-content;
        min-height: calc(100% - 428px);
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        overflow: hidden;
    }
    
    .page-content-container {
        z-index: 50;
        position: relative;
        max-width: 750px;
        display: flex;
        flex-direction: column;
        margin-top: 0px;
        align-content: center;
        overflow-x: scroll;
    }

    .text-container {
        z-index: 0;
        position: relative;
        height: 450px;
        min-height: 450px;
        display: flex;
        flex-direction: column;
        /*justify-content: space-between;*/
        width: 100%;
        min-width: 500px;
        border-bottom: 2px solid #b6f0d1;
    }

    .lower-text-container {
        display: none;
        visibility: hidden;
    }

    .headline-content {
        z-index: 0;
        padding: 0px 25px;
    }

    .text-content {
        z-index: 0;
        color: #444444;
        margin-top: 10px;
        margin-left: 25px;
        margin-right: 25px;
        line-height: 2.0;
    }

    .bef-owner {
        width: 150px;
        position: absolute;
        bottom: 0px;
        right: 200px;
    }

    .bef-owner-lower {
        display: none;
    }

    .upper-partial-text-content {
        display: flex;
        visibility: visible;
    }

    .lower-partial-text-content {
        display: none;
        visibility: hidden;
    }

    .tile-container {
        z-index: 0;
        position: relative;
        height: fit-content;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-content: center;
        width: 100%;
        min-width: 630px;
        margin-top: 75px;
    }

    .outer-service-container {
        position: relative; /**/
        display: flex;
        flex-direction: row;
        justify-content: center;
        min-width: 100%;
    }

    .inner-service-container {
        position: relative; /**/
        display: flex;
        flex-direction: column;
    }

    .service-container {
        position: relative; /**/
        width: 200px;
        min-width: 200px;
        max-width: 200px;
        height: 150px !important;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        padding: 15px;
        margin: 25px;
        border-radius: 30px;
        background-color: rgb(254,240,253);
    }

    .service-container:hover {
        background-color: #b6f0d1;
        transition: 0.7s all ease;
        cursor: pointer;
    }

    .service-logo-container {
        position: relative; /**/
        height: 85px; /**/
        display: flex;
        justify-content: center;
        margin-bottom: 15px;
    }

    .bef-service {
        position: relative; /**/
        width: 50%;
        border-radius: 300px;
    }

    .service-description-container {
        position: relative; /**/
        display: flex;
        justify-content: center;
    }

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

    .footer {
        z-index: 90;
        position: relative;
        bottom: 0px;
        width: 100%;
        font-size: 0.70rem;
        padding: 20px 30px 20px 30px;
        line-height: 1.6;
        background-color: #ffffff;
    }

    .footer-text {
        color: #aaaaaa;
        padding: 3px 15px;
        display: block;
    }

    .footer-horizontal-rule {
        height: 1px;
        border: none;
        background: #444444;
    }

    .footer-sections-container {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        width: 709px;
    }

    .footer-section-container {
        box-sizing: border-box;
        padding: 15px 0 0 0;
        flex-shrink: 0;
    }

    .footer-section-container-title {
        color: #aaaaaa;
        padding: 3px 15px;
        display: block;
        font-weight: bold;
        margin-bottom: 10px;
    }

    .footer-link {
        color: #aaaaaa !important;
        padding: 3px 15px;
        display: block;
        text-decoration: none;
    }

    .footer-link:hover {
        color: #b9c8ff;
        transition: 0.7s all ease;
    }

    .footer-link:visited {
        color: #aaaaaa !important;
        text-decoration: none;
    }

    address {
        color: #aaaaaa;
        padding: 3px 15px;
        display: block;
        text-decoration: none;
    }

    .cookies-note {
        color: #aaaaaa !important;
        padding: 3px 15px;
        display: block;
    }
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------- CSS for Mobile Devices ---------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media only screen and (max-width: 768px) and (orientation: portrait) {
    
    /* comfortaa-regular - latin */
    @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Comfortaa';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/comfortaa-v40-latin-regular.eot'); /* IE9 Compat Modes */
    src: url('../fonts/comfortaa-v40-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
            url('../fonts/comfortaa-v40-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
            url('../fonts/comfortaa-v40-latin-regular.woff') format('woff'), /* Modern Browsers */
            url('../fonts/comfortaa-v40-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
            url('../fonts/comfortaa-v40-latin-regular.svg#Comfortaa') format('svg'); /* Legacy iOS */
    }
      
    /* comfortaa-700 - latin */
    @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Comfortaa';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/comfortaa-v40-latin-700.eot'); /* IE9 Compat Modes */
    src: url('../fonts/comfortaa-v40-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
            url('../fonts/comfortaa-v40-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
            url('../fonts/comfortaa-v40-latin-700.woff') format('woff'), /* Modern Browsers */
            url('../fonts/comfortaa-v40-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
            url('../fonts/comfortaa-v40-latin-700.svg#Comfortaa') format('svg'); /* Legacy iOS */
    }

    @viewport {
        width: device-width;
        zoom: 1;
    }
    
    html, body {
        height: 100%;
        min-height: 100% !important;
        -webkit-text-size-adjust: none !important;
        -moz-text-size-adjust: none !important;
        -ms-text-size-adjust: none !important;
    }

    a:any-link {
        color: #444444;
        text-decoration: none;
    }

    a:visited {
        color: #444444;
        text-decoration: none;
    }
        
    * {
        padding: 0px;
        margin: 0px;
        box-sizing: border-box;
        font-family: 'Comfortaa', sans-serif;
        font-size: 1.0em;
    }
    
    .general-page-wrapper {
        display: flex;
        flex-direction: column;
        position: relative;
        height: fit-content;
        min-height: 100vh;
        align-items: center;
    }
        
    .header-container {
        width: 100vw;
        height: 150px;
        display: flex;
        flex-direction: row;
        position: relative;
        margin-bottom: 10px;
    }
    
    .header {
        z-index: 999;
        position: fixed;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        background: rgb(254,240,253);
        background: radial-gradient(circle, rgba(254,240,253,1) 0%, rgba(255,255,255,1) 95%);
    }

    .upper-container {
        position: relative;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 100px;
    }
    
    .lower-container {
        position: relative;
        display: flex;
        flex-direction: row;
        width: 100%;
    }
        
    .bef-logo {
        z-index: 100;
        height: 70px;
        border-radius: 10px;
        margin: 15px;
        box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
    }
    
    .header-text {
        display: flex;
    }
    
    .contact-text-container {
        z-index: 100;
        display: flex;
        position: unset;
        width: 100%;
        height: 50px;
        justify-content: center;
        align-items: center;
        line-height: 1.5;
        background-color: #b6f0d1;
        border-radius: 0px;
    }
    
    .contact-text-circle {
        display: none;
        visibility: hidden;
    }
    
    .contact-text-rectangle {
        display: flex;
        text-align: center;
        visibility: visible;
    }

    .home-button-container {
        z-index: 60;
        position: absolute;
        top: 150px;
        right: 0px;
        width: 65px;
        padding: 5px 15px;
        text-align: center;
        border-bottom-left-radius: 25px;
        background: rgb(254,240,253);
        background: linear-gradient(90deg, rgba(254,240,253,1) 0%, rgba(255,255,255,1) 95%);
    }

    .home-button-arrow {
        font-size: large;
    }
    
    .page-content-wrapper {
        z-index: 50;
        position: relative;
        min-height: 100vh; /* Fallback for browsers that do not support Custom Properties */
        min-height: calc((var(--vh, 1vh) * 100) - 170px);
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        overflow: hidden;
        width: 100%;
    }
        
    .page-content-container {
        z-index: 50;
        position: relative;
        width: 100%;
        max-width: 100%;
        display: flex;
        flex-direction: column;
        margin-top: 0px;
        align-content: center;
        overflow-x: scroll;
    }
    
    .text-container {
        z-index: 0;
        position: relative;
        height: fit-content;
        display: flex;
        flex-direction: column;
        width: 100%;
        min-width: 100%;
        max-width: 100%;
    }

    .lower-text-container {
        display: flex;
        visibility: visible;
    }
    
    .headline-content {
        z-index: 0;
        padding: 0px 25px;
    }
    
    .text-content {
        z-index: 0;
        color: #444444;
        margin-top: 10px;
        margin-left: 25px;
        margin-right: 25px;
        line-height: 2.0;
    }

    .bef-owner {
        display: none;
    }

    .bef-owner-lower {
        display: flex;
        width: 150px;
        margin-top: 15px;
        border: 2px solid lightgrey;
        border-radius: 150px;
        align-self: center;
    }

    .upper-partial-text-content {
        display: none;
        visibility: hidden;
    }
    
    .lower-partial-text-content {
        display: flex;
        visibility: visible;
        margin-top: 15px;
    }
        
    .tile-container {
        z-index: 0;
        position: relative;
        height: fit-content;
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: space-between;
        align-content: center;
        width: 100%;
        min-width: 100%;
        max-width: 100%;
        margin-top: 0px;
        margin-bottom: 0px;
        padding-top: 15px;
        background-color: white;
    }
    
    .outer-service-container {
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-width: 100%;
        margin: 15px 0px;
    }
    
    .inner-service-container {
        display: flex;
        flex-direction: row;
        margin: 0px 20px;
        width: calc(100% - 40px);
        max-width: calc(100% - 40px);
    }
    
    .service-container {
        width: calc(50% - 10px);
        min-width: calc(50% - 10px);
        height: 100px !important;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-around;
        padding: 15px;
        margin: 5px;
        background-color: rgb(254,240,253);
        border: 1px solid lightgrey;
        border-radius: 15px;
    }
    
    .service-container:hover {
        background-color: #b6f0d1;
        transition: 0.7s all ease;
        cursor: pointer;
    }
    
    .service-logo-container {
        display: flex;
        justify-content: center;
        margin-bottom: 5px;
        width: 100%;
    }
    
    .bef-service {
        height: 70px;
        border-radius: 300px;
    }
    
    .service-description-container {
        display: flex;
        justify-content: center;
        width: 100%;
    }
    
    .service-description {
        text-align: center;
        font-size: x-small;
    }
    
    .footer {
        z-index: 90;
        position: relative;
        bottom: 0px;
        width: 100%;
        font-size: 0.70rem;
        padding: 10px 0px 20px 0px;
        margin-top: 20px;
        line-height: 1.6;
        background-color: #333333;
    }
    
    .footer-text {
        color: #aaaaaa;
        padding: 3px 15px;
        display: block;
    }
    
    .footer-horizontal-rule {
        height: 1px;
        border: none;
        background: #444444;
    }

    .footer-sections-container {
        display: flex;
        flex-direction: column-reverse;
        justify-content: space-between;
        width: 100%;
        overflow: hidden;
        flex-wrap: wrap;
    }
    
    .footer-section-container {
        box-sizing: border-box;
        padding: 15px 0 0 0;
        flex-shrink: 0;
    }
    
    .footer-section-container-title {
        color: #aaaaaa;
        padding: 3px 15px;
        display: block;
        font-weight: bold;
        margin-bottom: 10px;
    }
    
    .footer-link {
        color: #aaaaaa !important;
        padding: 3px 15px;
        display: block;
        text-decoration: none;
    }
    
    .footer-link:hover {
        color: #b9c8ff;
        transition: 0.7s all ease;
    }

    .footer-link:visited {
        color: #aaaaaa !important;
        text-decoration: none;
    }

    address {
        color: #aaaaaa;
        padding: 3px 15px;
        display: block;
        text-decoration: none;
    }

    .cookies-note {
        color: #aaaaaa !important;
        padding: 3px 15px;
        display: block;
    }
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------- CSS for Mobile Devices ---------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media only screen and (max-width: 768px) and (orientation: landscape) {
    
    /* comfortaa-regular - latin */
    @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Comfortaa';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/comfortaa-v40-latin-regular.eot'); /* IE9 Compat Modes */
    src: url('../fonts/comfortaa-v40-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/comfortaa-v40-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/comfortaa-v40-latin-regular.woff') format('woff'), /* Modern Browsers */
        url('../fonts/comfortaa-v40-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/comfortaa-v40-latin-regular.svg#Comfortaa') format('svg'); /* Legacy iOS */
    }
          
    /* comfortaa-700 - latin */
    @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Comfortaa';
    font-style: normal;
    font-weight: 700;
    src: url('../fonts/comfortaa-v40-latin-700.eot'); /* IE9 Compat Modes */
    src: url('../fonts/comfortaa-v40-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('../fonts/comfortaa-v40-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
        url('../fonts/comfortaa-v40-latin-700.woff') format('woff'), /* Modern Browsers */
        url('../fonts/comfortaa-v40-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
        url('../fonts/comfortaa-v40-latin-700.svg#Comfortaa') format('svg'); /* Legacy iOS */
    }

    @viewport {
        width: device-width;
        height: device-height;
        zoom: 1;
    }
    
    html, body {
        height: 100%;
        min-height: 100% !important;
        -webkit-text-size-adjust: none !important;
        -moz-text-size-adjust: none !important;
        -ms-text-size-adjust: none !important;
    }

    a:any-link {
        color: #444444;
        text-decoration: none;
    }

    a:visited {
        color: #444444;
        text-decoration: none;
    }
        
    * {
        padding: 0px;
        margin: 0px;
        box-sizing: border-box;
        font-family: 'Comfortaa', sans-serif;
        font-size: 1.0em;
    }
    
    .general-page-wrapper {
        display: flex;
        flex-direction: column;
        position: relative;
        height: fit-content;
        min-height: 100%;
        align-items: center;
    }
        
    .header-container {
        width: 100vw;
        height: 150px;
        display: flex;
        flex-direction: row;
        position: relative;
        margin-bottom: 10px;
    }
    
    .header {
        z-index: 999;
        position: fixed;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        background: rgb(254,240,253);
        background: radial-gradient(circle, rgba(254,240,253,1) 0%, rgba(255,255,255,1) 95%);
    }

    .upper-container {
        position: relative;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 100px;
    }
    
    .lower-container {
        position: relative;
        display: flex;
        flex-direction: row;
        width: 100%;
    }
        
    .bef-logo {
        z-index: 100;
        height: 70px;
        border-radius: 10px;
        margin: 15px;
        box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
    }
    
    .header-text {
        display: flex;
    }
    
    .contact-text-container {
        z-index: 100;
        display: flex;
        position: unset;
        width: 100%;
        height: 50px;
        justify-content: center;
        align-items: center;
        line-height: 1.5;
        border-radius: 0px;
        background: rgb(182,240,209);
        background: radial-gradient(circle, rgba(182,240,209,1) 50%, rgba(255,255,255,1) 100%);
    }
    
    .contact-text-circle {
        display: none;
        visibility: hidden;
    }
    
    .contact-text-rectangle {
        display: flex;
        text-align: center;
        visibility: visible;
    }

    .home-button-container {
        z-index: 60;
        position: absolute;
        top: 150px;
        right: 0px;
        width: 65px;
        padding: 5px 15px;
        text-align: center;
        border-bottom-left-radius: 25px;
        background: rgb(254,240,253);
        background: linear-gradient(90deg, rgba(254,240,253,1) 0%, rgba(255,255,255,1) 95%);
    }

    .home-button-arrow {
        font-size: large;
    }
    
    .page-content-wrapper {
        z-index: 50;
        position: relative;
        width: 100%;
        max-width: 600px;
        height: fit-content;
        min-height: 100vh; /* Fallback for browsers that do not support Custom Properties */
        min-height: calc((var(--vh, 1vh) * 100) - 190px);
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        overflow: hidden;
    }
        
    .page-content-container {
        z-index: 50;
        position: relative;
        width: 100%;
        max-width: 100%;
        display: flex;
        flex-direction: column;
        margin-top: 0px;
        align-content: center;
        overflow-x: scroll;
    }
    
    .text-container {
        z-index: 0;
        position: relative;
        height: fit-content;
        display: flex;
        flex-direction: column;
        width: 100%;
        min-width: 100%;
        max-width: 100%;
    }

    .lower-text-container {
        display: flex;
        visibility: visible;
    }
    
    .headline-content {
        z-index: 0;
        padding: 0px 25px;
    }
    
    .text-content {
        z-index: 0;
        color: #444444;
        margin-top: 10px;
        margin-left: 25px;
        margin-right: 25px;
        line-height: 2.0;
    }

    .bef-owner {
        display: none;
    }

    .bef-owner-lower {
        display: flex;
        width: 150px;
        margin-top: 15px;
        border: 2px solid lightgrey;
        border-radius: 150px;
        align-self: center;
    }

    .upper-partial-text-content {
        display: none;
        visibility: hidden;
    }
    
    .lower-partial-text-content {
        display: flex;
        visibility: visible;
        margin-top: 15px;
    }
        
    .tile-container {
        z-index: 0;
        position: relative;
        height: fit-content;
        display: flex;
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: space-between;
        align-content: center;
        width: 100%;
        min-width: 100%;
        max-width: 100%;
        margin-top: 0px;
        margin-bottom: 0px;
        padding-top: 15px;
        background-color: white;
    }
    
    .outer-service-container {
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-width: 100%;
        margin: 15px 0px;
    }
    
    .inner-service-container {
        display: flex;
        flex-direction: row;
        margin: 0px 20px;
        width: calc(100% - 40px);
        max-width: calc(100% - 40px);
    }
    
    .service-container {
        width: calc(50% - 10px);
        min-width: calc(50% - 10px);
        height: 100px !important;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-around;
        padding: 15px;
        margin: 5px;
        background-color: rgb(254,240,253);
        border: 1px solid lightgrey;
        border-radius: 15px;
    }
    
    .service-container:hover {
        background-color: #b6f0d1;
        transition: 0.7s all ease;
        cursor: pointer;
    }
    
    .service-logo-container {
        display: flex;
        justify-content: center;
        margin-bottom: 5px;
        width: 100%;
    }
    
    .bef-service {
        height: 70px;
        border-radius: 300px;
    }
    
    .service-description-container {
        display: flex;
        justify-content: center;
        width: 100%;
    }
    
    .service-description {
        text-align: center;
        font-size: x-small;
    }
    
    .footer {
        z-index: 90;
        position: relative;
        bottom: 0px;
        width: 100%;
        font-size: 0.70rem;
        padding: 10px 0px 20px 0px;
        margin-top: 20px;
        line-height: 1.6;
        background-color: #ffffff;
    }
    
    .footer-text {
        color: #333333;
        padding: 3px 15px;
        display: block;
    }
    
    .footer-horizontal-rule {
        height: 1px;
        border: none;
        background: #333333;
    }

    .footer-sections-container {
        display: flex;
        flex-direction: column-reverse;
        justify-content: space-between;
        width: 100%;
        overflow: hidden;
        flex-wrap: wrap;
    }
    
    .footer-section-container {
        box-sizing: border-box;
        padding: 15px 0 0 0;
        flex-shrink: 0;
    }
    
    .footer-section-container-title {
        color: #333333;
        padding: 3px 15px;
        display: block;
        font-weight: bold;
        margin-bottom: 10px;
    }
    
    .footer-link {
        color: #333333;
        padding: 3px 15px;
        display: block;
        text-decoration: none;
    }
    
    .footer-link:hover {
        color: #b9c8ff;
        transition: 0.7s all ease;
    }

    .footer-link:visited {
        color: #333333 !important;
        text-decoration: none;
    }

    address {
        color: #333333;
        padding: 3px 15px;
        display: block;
        text-decoration: none;
    }

    .cookies-note {
        color: #333333 !important;
        padding: 3px 15px;
        display: block;
    }
}