* {
           margin: 0;
           /*max-width: 100vw;*/
           box-sizing: border-box;
           /* font-family: "Open Sans", sans-serif; */
           /* font-family: "Oswald", sans-serif;
            font-weight: 100; */
           font-optical-sizing: auto;
           -webkit-font-smoothing: antialiased;
           -moz-osx-font-smoothing: grayscale;
           letter-spacing: 1px;
       }

       html {
           min-width: 100% !important;
           /*scroll-behavior: smooth;*/
           /* mobile viewport bug fix */
           min-width: -webkit-fill-available;
           /* overflow-x: hidden; */
           position: static;
       }

       .htmlStatic {
           position: static;
       }

       .htmlFixed {
           position: fixed;
       }



       /* Cookie --------------------------------------------------------------------*/
       .cookieWindowBack {
           display: block;
           /* This is the animated thing*/
           position: fixed;
           top: 0;
           background-color: rgba(255, 255, 255, 0.635);
           width: 100%;
           height: 100%;
           transition: 500mx;
           z-index: 99;
       }

       .cookieWindow {
           position: relative;
           top: 50%;
           left: 50%;
           translate: -50% -40%;
           border-radius: 10px;
           display: flex;
           flex-direction: column;
           width: 70%;
           width: 380px;
           min-width: 380px;
           height: 500px;
           background-color: #1e1e1e;
           background-color: #ffffff;
           box-shadow: 0px 5px 12px rgba(0, 0, 0, 0.224);
           z-index: 9999999;
           overflow: hidden;
       }

       .cookieText {
           translate: 0% -80px;
       }

       .cookieWindow p {
           position: relative;
           color: rgb(24, 24, 24);
           font-size: 11px;
           margin: auto;
           width: 80%;
           height: 100%;
           z-index: 9999999;
       }

       .cookieWindow h2 {
           position: relative;
           color: yellowgreen;
           width: 80%;
           font-size: 17px;
           margin: auto;
           margin-bottom: 12px;
           margin-top: 200px;
           z-index: 9999999;
       }

       .cookieSVG {
           position: absolute;
           opacity: .1;
           left: -110px;
           top: -105px;
       }

       .cookieButtons {
           position: absolute;
           bottom: 20px;
           display: flex;
           justify-content: center;
           width: 100%;
           margin: auto;
       }

       .cookieButtons button {
           border: none;
           width: 40%;
           padding: 10px 0px;
           border-radius: 5px;
           margin: 5px;
       }

       .cookieButtons button:hover {
           border: none;
           width: 40%;
           background-color: yellowgreen;
           color: white;
           padding: 10px 0px;
           border-radius: 5px;
           margin: 5px;
           transition: 200ms;
       }








       /* Text Einstaellungen --------------------------------------------------------------------*/

       .HeadlineFliesstext {
           font-family: "Poppins", sans-serif;
           font-weight: 800;
           font-weight: 400;
       }

       .Fliesstext_regular {
           font-family: "Poppins", sans-serif;
           font-weight: 800;
           font-weight: 400;
       }

       .Headline_fat {
           font-optical-sizing: auto;
           font-family: "Poppins", sans-serif;
           font-weight: 800;
           font-style: normal;
       }

       a[href^="tel"],
       a[href^="mailto"] {
           color: inherit;
           /* inherit text color of parent element */
           text-decoration: none;
           /* (optional) remove underline */
       }


       :root {
           --doc-height: 100%;
       }


       body {}

       .site {
           background-color: rgb(83, 81, 81);
           background-color: rgb(56, 53, 53);
           background-color: #222222;
           border-bottom-color: white;
           z-index: -2;
           padding: 0;
           min-width: 100% !important;
           min-width: -webkit-fill-available;
           min-height: 100vh;
           min-height: -webkit-fill-available;
           /*             min-height: 100vh; /* fallback for Js load */
           /* min-height: var(--doc-height); */
           margin: 0;
           display: flex;
           flex-direction: column;
           /* Unnecessary IMHO, uncomment next line to force hidden behavior */
           /* overflow-x: hidden !important; */
           /* Additional tunning proposed by the community */
           position: relative;
           width: 100%;
       }

       .site-content {
           flex: 1;
           min-height: 100vh;
       }

       footer>* {
           display: block;
           min-width: 100% !important;
           width: 300px;
           overflow-x: hidden;
           height: 320px;
           position: absolute;
           margin: auto;
           overflow-y: hidden;
       }

       .distance01 {
           height: 0px;
           margin: 50px;
       }

       .footerOuter {
           width: 100%;
           padding-left: 50px;
           padding-right: 50px;
           display: block;
           margin: auto;
       }

       .footerOuter ul,
       .footerOuter li,
       .footerOuter a {
           list-style-type: none;
           text-decoration: none;
           font-size: 14px;
           text-wrap: nowrap;
           color: rgb(156, 156, 156);
           line-height: 20px;
           transform: translateY(-20px);
           transition: .6s;
       }

       .footerOuter ul {
           margin-top: 55px;
       }

       .footerULFirstUl {
           margin-left: 75px;
       }

       .logo_footer {
           position: absolute;
           transform: translate(0px, -10px);
           height: 113px;
           width: 76px;
           margin-top: 20px;
           opacity: 0.99;
       }

       .footerContainer_Desktop {
           margin-top: 90px;
           min-width: 841px;
           display: flex;
           translate: 0px 20px;
           flex-direction: row;
           justify-content: flex-start;
           padding: 0px;
           bottom: 0px;
           border-radius: 20px;
           left: 0;
       }

       .footerContainer_Tablet {
           margin-top: 90px;
           display: flex;
           flex-direction: row;
           justify-content: flex-start;
           display: none;
           translate: 0px 20px;
           padding: 0px;
           bottom: 0px;
           left: 0;
       }

       .footerContainer_Mobile {
           margin-top: 90px;
           display: flex;
           flex-direction: row;
           justify-content: flex-start;
           display: none;
           translate: 0px 40px;
           padding: 0px;
           bottom: 0px;
           left: 0;
       }

       .lastItem {
           margin-left: auto;
           margin-right: 0px;
       }

       .lastItemMobile {
           margin-left: auto;
           margin-right: 0px;
       }

       #footerLinkMail1:hover,
       #footerLinkMail2:hover,
       #footerLinkMail3:hover {
           color: greenyellow;
       }

       .footerLinkHover:hover {
           color: greenyellow;
       }

       #noLink1 {
           cursor: auto;
       }

       #noLink2 {
           cursor: auto;
       }

       #noLink3 {
           cursor: auto;
       }

       .footerFont01 {
           border: 1px dotted rgba(255, 255, 255, 0.103);
           border-radius: 40px;
           text-wrap: no-wrap;
           padding: 5px;
           padding-left: 10px;
           margin-top: 0px;
           min-width: 460px;
           color: rgb(156, 156, 156);
           line-height: 21px;
       }

       .footerFont01small {
           border: 1px dotted rgba(255, 255, 255, 0.103);
           border-radius: 40px;
           text-wrap: no-wrap;
           padding: 5px;
           padding-left: 10px;
           min-width: 174px;
           color: rgb(156, 156, 156);
           line-height: 21px;
           transform: translateY(30px);
       }

       .l {
           float: left;
       }

       .rechtHead {
           position: relative;
           height: 30px;
           margin: auto;
           margin-top: 250px;
           margin-bottom: 50px;
           font-size: 20px;
           text-align: center;
           color: white;
       }

       .RechtlicheHinweise {
           max-width: 800px;
           margin: auto;
           margin-top: 280px;
           padding: 0px 50px;
           color: rgb(150, 150, 150);
       }

       .PortfolioHeadline {
           max-width: 800px;
           margin: auto;
           text-align: center;
           margin-top: 280px;
           padding: 0px 50px;
           color: rgb(150, 150, 150);
       }

       .PortfolioSpacing {
           max-width: 800px;
           margin: auto;
           text-align: center;
           margin-top: 280px;
           padding: 0px 50px;
           color: rgb(150, 150, 150);
       }

       .H1Rechtl01 {
           margin-top: 50px;
           font-family: "Open sans", sans-serif;
           font-weight: 400;
           color: white;
           z-index: -5;
       }

       .H1Rechtl01Underline {
           font-size: 22px;
           font-family: "Open sans", sans-serif;
           line-height: 28px;
           margin-top: -10px;
           color: white;
           font-weight: 200;
           z-index: -5;
       }

       .H1Rechtl02 {
           color: rgb(180, 180, 180);
           font-family: "Open sans", sans-serif;
           font-weight: 400;
           font-size: 22px;
           margin-bottom: 10px;
           z-index: -5;
       }

       .H1Rechtl02>h1 {
           color: white;
           font-weight: 200;
           font-size: 22px;
           margin-bottom: 10px;
           z-index: -5;
       }

       .white {
           color: white;
       }

       .ygreen {
           color: yellowgreen;
       }

       .kontaktspacer {
           height: 11vh;
       }

       .UeberKontaktBox {
           margin: 0px 50px 0px;
           display: flex;
           justify-content: center;
       }

       .KontaktContainer {
           position: relative;
           max-width: 800px;
           display: grid;
           grid-template-columns: repeat(2, 1fr);
           grid-template-columns: auto auto;
           grid-template-rows: 1fr;
           column-gap: 40px;
           margin: auto;
           align-items: baseline;

       }

       .KontaktAnschrift {
           text-wrap: nowrap;
           display: inline-block;
           align-self: bottom;
           text-wrap: nowrap;
           margin-left: 0;
           margin-bottom: 50px;
           translate: 0px -10px;
           bottom: 0;
       }

       .KontaktTable {
           display: block;
           padding-top: 20px;
           margin-left: 40px;
       }

       /* Kontaktfeld php ------------------------------------------------------------ */
       .Kontaktfeld_container {
           display: inline-block;
           margin: 0;
           flex-direction: column;
           align-items: flex-start;
           position: relative;
           max-width: 400px;
       }

       .Kontaktfeld_row label {
           margin-top: 0px;
           color: rgb(160, 160, 160);
           margin-bottom: 20px;
           padding: 2px;
           border: none;
           height: 35px;
           width: 100%;
       }

       .Kontaktfeld_row input {
           margin-top: 0px;
           margin-bottom: 20px;
           padding: 2px;
           border: none;
           height: 35px;
           width: 100%;
       }

       .Kontaktfeld_row input[type="text"] {
           margin-top: 0px;
           margin-bottom: 20px;
           padding: 2px;
           border: none;
           height: 35px;
           width: 100%;
       }

       .Kontaktfeld_container textarea {
           margin-top: 0px;
           margin-bottom: 20px;
           padding: 2px;
           border: none;
           height: 135px;
           width: 100%;
       }

       .Kontaktfeld_container button {
           margin-top: 20px;
           color: rgb(255, 255, 255);
           padding: 2px;
           border: none;
           background-color: yellowgreen;
           border-radius: 25px;
           height: 35px;
           width: 100%;
       }

       .Kontaktfeld_container a {
           text-decoration: none;
           color: yellowgreen;
       }



       form {
           display: flex;
           flex-direction: column;
       }

       input[type=text] {
           padding: 9px 190px 5px 10px;
           margin: 8px 0;
           display: inline-block;
           border: 1px solid #ccc;
           border-radius: 2px;
           box-sizing: border-box;
           width: clamp(280px, 300px, 400px);
           cursor: pointer;
       }

       input[type=textBox] {
           width: 100%;
           padding: 7px 90px 180px 10px;
           margin: 8px 0;
           display: inline-block;
           border: 1px solid #ccc;
           border-radius: 2px;
           box-sizing: border-box;
           width: 300px;
           cursor: pointer;
       }

       input::placeholder {
           overflow: visible;
       }

       input[type=submit] {
           margin-top: 20px;
           width: 100px;
           background-color: yellowgreen;
           padding: 7px 0px 7px 0px;
           ;
           color: white;
           border: none;
           border-radius: 50px;
       }














       /* Header Menu --------------------------------------------------------------- */
       .headermenu {
           position: absolute;
           top: 0px;
           height: 80px;
           width: 100%;
           /* z-index: -2; */
       }

       .insideheader {
           position: relative;
           max-width: 100vw;
           display: flex;
           flex-direction: row;
           font-size: 16px;
           margin: 0;
       }

       .logo {
           position: absolute;
           width: 80px;
           margin: 0px;
           top: 20px;
           margin-left: 40px;
           opacity: 0.99;
           filter: drop-shadow(0px 0px 25px rgb(0 0 0 / 0.1));
           z-index: 2;
       }

       #cut {
           position: absolute;
           height: 1020px;
           width: 100%;
           margin-top: -80px;
           display: block !important;
           overflow: hidden;
           z-index: 0;
       }

       .headerbackground {
           position: relative;
           width: 150%;
           transform: translate(-80px, -300px);
           z-index: 2;
           height: 520px;
           rotate: 20deg;
           background-color: #222222;
       }

       #cut2 {
           position: absolute;
           /*border: 1px solid red;*/
           height: 520px;
           transform: translate(00px, -290px);
           width: 100%;
           margin-top: -80px;
           display: block !important;
           overflow: hidden;
           z-index: 1;
       }

       .headerbackground2 {
           position: relative;
           width: 150%;
           transform: translate(-80px, 260px);
           z-index: 0;
           height: 520px;
           rotate: 8deg;
           background-color: #222222;
       }

       .headermenuItem {
           display: flex;
           flex-direction: row;
           flex: auto;
           justify-content: flex-end;
           align-items: center;
           list-style-type: none;
           padding: 62px 50px 0px 0px;
           z-index: 2;
       }

       .headermenuItem a {

           text-decoration: none;
           color: white;
           transition: .6s;

       }

       .headermenuItem li {
           list-style-type: none;
           border-radius: 5px;
           text-decoration: none;
           padding: 2px 10px;
           color: rgb(156, 156, 156);
           line-height: 21px;
           transition: .6s;
       }

       .headermenuItem a:hover {
           color: greenyellow;
           transition: .6s;
       }

       .mediaIcons:hover {
           filter: invert(25%) sepia(81%) saturate(497%) hue-rotate(26deg) brightness(107%) contrast(101%);
           transition: .6s;
       }

       .mediaIconsContainer {
           transform: translateY(3px);
           margin-left: 5px;
       }

       #MenuKontakt {
           background-color: yellowgreen;
           border-radius: 50px;
           padding: 4px 20px 4px 20px;
       }

       #MenuKontakt:hover {
           background-color: rgb(255, 255, 255);
           color: #57bd28;
       }

       .mobileBack {
           position: sticky;
           top: 0;
           margin: 0px;
           padding: 0;
           width: 100vw;
           height: 50px;
           background-color: white;
           display: none;
       }














       /* Background Slider -------------------------------------------------------- */

       .headerIMGcontainer {
           background-color: black;
           min-width: 100%;
           margin: auto;
           position: relative;
           /* war absolut */
           overflow: hidden;
       }


       .capslideImage1 {
           background: url(../Web_Bilder/00_Header_01_IMAGES.jpg);
           width: 100%;
           height: 100%;
           background-size: cover;
           background-position: center;
           position: absolute;
           /*overflow-x: hidden;*/
           align-items: center;
           justify-content: center;
           animation: CapslideScale 42s linear infinite;
       }

       .capslideImage2 {
           background: url(../Web_Bilder/00_Header_02_Tichraum_01b.jpg);
           width: 100%;
           height: 100%;
           background-size: cover;
           background-position: center;
           position: absolute;
           /*overflow-x: hidden;*/
           align-items: center;
           justify-content: center;
           animation: CapslideScale 42s linear infinite;
       }

       .capslideImage3 {
           background: url(../Web_Bilder/00_Header_03_Bedroom0_1b.jpg);
           width: 100%;
           height: 100%;
           background-size: cover;
           background-position: center;
           position: absolute;
           /*overflow-x: hidden;*/
           align-items: center;
           justify-content: center;
           animation: CapslideScale 42s linear infinite;
       }

       @keyframes CapslideScale {
           0% {
               scale: 1;
           }

           50% {
               scale: 1.2;
           }

           100% {
               scale: 1;
           }
       }


       #zIndex2 {
           z-index: 5 !important;
       }

       .Sliderarrow {
           position: absolute;
           top: 50%;
           transform: translateY(-50%);
           cursor: pointer;
           z-index: 10000;
           background-color: rgba(0, 0, 0, .15);
           border-radius: 15%;
           margin: 0px 20px;
           padding: 15px;
           color: white;
           transition: 500ms;
       }

       .Sliderarrow:hover {
           background-color: rgba(153, 179, 138, 0.48);
       }

       .l {
           left: 0;
       }

       .r {
           right: 0;
       }

       .Capslide {
           width: 100vw;
           height: 100vh;
           /*background-size: cover;
            background-position: center;
            position: relative;   This is causing scroll problems*/
           /* overflow-x: hidden; */
           align-items: center;
           justify-content: center;
       }




       .caption {
           position: absolute;
           background-color: rgba(0, 0, 0, 0.00);
           border-radius: 10px;
           color: greenyellow;
           color: white;
           color: rgb(168, 158, 153);
           color: rgb(79, 76, 75);
           width: 100%;
           top: 50%;
           transform: translateY(-30%);
           padding-top: 20px;
           line-height: calc(3vw + 2vh + 1vw);
           text-align: center;
           font-size: calc(8vw + .5vh + 1vw);

       }

       .caption p {
           margin-top: 20px;
           scale: .4;
       }

       .caption h3 {}

       .HomeHeadlineTool {
           background: rgb(210, 210, 205);
           background: rgb(31, 31, 31);
           text-transform: uppercase;
           width: 100%;
           width: 100%;
           height: 30px;
           position: absolute;
           position: sticky;
           border-color: #222222;
           border-top: 15px;
           padding: 10px 10px;
           box-shadow: inset 0px -3px 15px rgba(131, 131, 131, 0.015);
           top: calc(100vh - 30px);
           top: 0;
           z-index: 21;
           overflow: hidden;
       }

       .HomeHeadlineTool hr {
           position: absolute;
           display: inline;
           border: none;
           width: 40px;
           height: 1px;
           background-color: #7f7f7f;
           margin: 10px -20px;
           rotate: -90deg;
           translate: 0px 5px;
       }

       .HomeHeadlineTool h1 {
           font-family: "Poppins", sans-serif;
           font-weight: 200;
           color: #222222;
           text-align: center;
           text-rendering: auto;
           letter-spacing: 5px;
           white-space: nowrap;
           font-size: min(3vw, 14px);
           translate: 0px -13px;
           /* overflow-x: hidden; */
           animation: blinkIt 3s linear alternate infinite;
       }

       @keyframes blinkIt {
           0% {
               filter: brightness(0.9);
           }

           50% {
               filter: brightness(1.1);
               /* Adjust to half your total content width if doubled */
           }

           100% {
               filter: brightness(0.9);
           }
       }

       .header_h1 {
           margin: auto;
           text-align: center;
           font-family: poppins;
           padding: 0px 50px 0px 50px;
           color: rgb(255, 255, 255);
           text-shadow: rgba(0, 0, 0, 0.912) 10px 0 50px;
       }

       .header_h1 p {
           max-width: 500px;
           font-size: 24px;
           color: white;
           margin-left: 50px;
           margin-right: 50px;
       }















       /* Content Block 1 ----------------------------------------------------------- */

       h1 {
           padding-bottom: 15px;
           line-height: 35px;
           font-weight: 800;
           margin-left: 0px;
           margin-right: 0px;

       }

       #schraegH1 {
           position: relative;
           color: rgb(137, 135, 127);
           text-align: center;
           rotate: 8deg;
           font-weight: 300;
           font-size: 2vw;
           transform: translate(-2vw, -14vw);
           z-index: 50;
       }

       .workIcons {
           margin: auto;
           display: flex;
           position: relative;
           margin: auto;
           margin-top: 10px;
           margin-bottom: 30px;
           flex-direction: row;
           justify-content: center;
           z-index: 20;
       }

       .workIcons h2 {
           position: relative;
           color: white;
           font-size: calc(7px + .5vw);
           text-align: center;
           font-weight: 400;
           translate: 0px 2px;
           padding-top: 1vw;
       }

       .theLine {
           position: absolute;
       }

       .line {
           position: absolute;
           fill: none;
           stroke: rgb(62, 62, 62);
           stroke-width: 1px;
       }

       .ball {
           display: hidden;
           margin: 2px;
           margin-top: 30px;
           scale: .0;
           translate: 0px 0px;
           fill: rgb(190, 195, 184);
       }

       #fatLine {
           position: relative;
           color: white;
           font-size: 7vw;
           translate: 0vw 0.7vw;
           text-align: center;
           font-weight: 800;
           padding-top: 9vw;
           margin-bottom: -20vw;
       }

       .ball05 {
           scale: 0;
       }

       .spacer {
           height: 20vw;
           width: auto;
       }

       .spacer1 {
           position: relative;
           height: 20px;
           width: 100%;
       }

       .spacer2 {
           position: absolute;
           height: 100vh;
           width: 100%;
       }


       .columOne {
           columns: 1 !important;
       }

       .Cblock1FlexCol {
           padding-top: calc(5vw + 25px);
           width: 100%;
           height: auto;
           display: flex;
           flex-basis: auto;
           flex-direction: row;
           flex-grow: 1;
           justify-content: center;
           align-items: flex-start;
           gap: 10px;
           margin-top: -7vw;
       }


       .Cblock1Index {
           padding-top: 12vw;
           height: auto;
           display: flex;
           flex-direction: column;
           overflow: hidden;
           justify-content: center;
           align-items: center;
           translate: 0px -3vw;
           padding-left: 40px;
           padding-right: 40px;
           margin-top: -7vw;
           overflow: hidden;
       }

       .Cblock1IndexB {
           display: flex;
           flex-direction: column;
           justify-content: center;
           align-items: center;
           margin: auto;
           max-width: 800px;
           padding-left: 0px;
           padding-right: 0px;
           margin-top: 10px;
           overflow: hidden;
           font-size: 13px;
           color: rgb(160, 160, 160);
       }

       .Cblock1Index #ColumnTWO {
           margin-left: 0px;
           margin-right: 0px;
           margin: auto;
           max-width: 800px;
           font-size: 13px;
           color: rgb(160, 160, 160);
           columns: 2;
       }

       .TextColumnSingle {
           margin: auto;
           display: flex;
           flex-direction: column;
           justify-content: center;
           align-items: center;
           max-width: 800px;
           font-size: 13px;
           color: rgb(160, 160, 160);
       }

       .KontaktTextHighlight {
           margin: auto;
           margin-top: 20px;
           padding: 7px 40px;
           text-align: center;
           background-color: yellowgreen;
           /* border: 1px solid rgba(160,160,160); */
           border-radius: 35px;
       }

       .HighlightHome {
           margin-top: 40px;
           /* border: 1px solid rgba(160,160,160);
        border-radius: 25px; */
       }

       .contentBock2IndexContainer {
           position: relative;
       }

       .CblockCenter {
           padding-top: 20px;
           height: auto;
           display: flex;
           flex-direction: column;
           justify-content: center;
           align-items: center;
           translate: 0px -3vw;
           padding-left: 0px;
           padding-right: 0px;
           /*         margin-top: calc(50px - 5vw); */
           overflow: hidden;
       }

       .Cblock1 {
           padding-top: 80px;
           height: auto;
           display: flex;
           flex-direction: column;
           overflow: hidden;
           justify-content: center;
           align-items: center;
           translate: 0px -3vw;
           padding-left: 40px;
           padding-right: 40px;
           margin-top: calc(50px - 5vw);
           overflow: hidden;
       }

       .Cblock1 p {
           margin-left: 0px;
           margin-right: 0px;
           margin: auto;
           max-width: 800px;
           font-size: 13px;
           color: rgb(160, 160, 160);
           columns: 2;
       }

       /*         .Cblock1 p b {
            color: rgb(255, 255, 255);
        } */
       .Cblock1_About {
           position: relative;
           margin-top: calc(100vh + 30px);
           height: auto;
           display: flex;
           flex-direction: column;
           justify-content: center;
           padding-left: 40px;
           padding-right: 40px;
           overflow: hidden;
       }

       .Cblock1_About p {
           /*             margin-left: 0px;
            margin-right: 0px;  */
           margin: auto;
           max-width: 800px;
           font-size: 13px;
           color: rgb(160, 160, 160);
           columns: 2;
       }

       .Cblock1_About h1 {
           padding-bottom: 15px;
           line-height: 35px;
           margin-left: 0px;
           margin-right: 0px;
           margin: auto;
           max-width: 800px;
           color: rgb(255, 255, 255);
           columns: 2;
       }


       .Cblock1_AboutsubVideo {

           max-width: 800px;
           margin: auto;
           position: relative;
           margin-top: calc(70px + (.5vw + 2vh));
           height: auto;
           display: flex;
           flex-direction: row;
           justify-content: center;
           align-items: start;
           flex-grow: 1;
           padding-left: 40px;
           padding-right: 40px;
           /* overflow: hidden; */
       }

       .Cblock1_AboutsubVideo p {
           /*             margin-left: 0px;
            margin-right: 0px;  */
           margin: auto;
           max-width: 800px;
           font-size: 13px;
           color: rgb(160, 160, 160);
       }

       .Cblock1_AboutsubVideo h1 {
           padding-bottom: 15px;
           line-height: 35px;
           margin-left: 0px;
           margin-right: 0px;
           margin: auto;
           max-width: 800px;
           color: rgb(255, 255, 255);
       }





       .Cblock1_About2 {
           position: relative;
           margin-top: 80px;
           height: min-content;
           display: flex;
           flex-direction: column;
           overflow: hidden;
           justify-content: center;
           /* border: 1px solid red; */
           padding-left: 40px;
           padding-right: 40px;
           overflow: hidden;
       }

       .profilfototext {
           width: 50%;
       }

       .AboutFlexPhoto {
           font-size: 13px;
           color: rgb(160, 160, 160);
           display: flex;
           flex-direction: row;
           flex-wrap: nowrap;
           height: min-content;
           max-width: 800px;
           margin: auto;
           padding-top: 80px;
           justify-content: center;
       }

       .profilbild {
           position: relative;
           background-size: cover;
           background-position: center;
           width: 30%;
           height: auto;
       }

       /*         .profilbild {
            position: relative;
            margin-top: 150px;
            margin-right: 20px;
            margin-left: -50px;
            background-image: url("/Website_Daten/Web_Bilder/IMG_1057profil.png");
            background-size: cover;
            background-position-x: -90px;
            border-bottom-right-radius: 50px;
            width: 270px;
            height: 400px;
            border-bottom: 1px solid rgb(46, 46, 46);
            border-right: 1px solid rgb(46, 46, 46);
            z-index: -1;
        } */

       .Cblock1_About2 p {
           margin-left: 0px;
           margin-right: 0px;
           margin: auto;
           max-width: 800px;
           font-size: 13px;
           color: rgb(160, 160, 160);
           columns: 1;
       }

       .Cblock1_About p b {
           color: rgb(255, 255, 255);
       }





       .fullscreenImgContainer0 {
           position: relative;
           margin: auto;
           height: 700px;
           width: 100%;
           margin-top: 60px;
           overflow: hidden;
       }

       .fullscreenImgContainer {
           position: relative;
           margin: auto;
           height: 700px;
           width: 100%;
           margin-top: 20px;
           overflow: hidden;
       }

       .layer {
           background-position: top center;
           background-size: fixed;
           background-repeat: no-repeat;
           width: 90%;
           height: 0vh;
           position: fixed;
           z-index: -1;
       }

       #hero,
       .layer {
           /* min-height:700px; */
       }

       .layer-1 {
           background-image: url("../Referenzen/B2_Scheune_Innen_03klein.jpg");
           background-size: cover;
           background-attachment: fixed;
           background-repeat: no-repeat;
           width: 100%;
           height: 1000px;
           translate: 0vh -1vh;
           background-position: center;
           animation: CapslideScale 22s linear alternate infinite;
       }

       .animate-me {
           animation: bounceIn 3s ease-in-out;
       }

       .imagehaus {
           position: absolute;
           display: block;
           left: 50%;
           transform: translate(-50%, -20%);
           width: 1000px;
           height: 800px;
           max-width: 100%;
           z-index: 0;
           background-image: url(https://media.istockphoto.com/id/476190573/vector/architecture.jpg?s=612x612&w=0&k=20&c=ZhCh_zpDZxEYbZipufMpCepHD79Vlbs5GGO76dQfTlg=);
           background-size: cover;
           background-color: white;
           filter: invert();
           mix-blend-mode: lighten;
           opacity: .07;
           margin-top: -120px;
       }

       .layer-10 {
           background-image: url("../Referenzen/Goldwell_01_RMPc.jpg");
           background-size: cover;
           background-attachment: fixed;
           background-repeat: no-repeat;
           width: 100%;
           height: 1000px;
           translate: 0vh -1vh;
           background-position: center;
           animation: CapslideScale 22s linear alternate infinite;
       }




       .Cblock2 {
           /* font-size: clamp(4vw, 40px, 20px); */
           font-size: clamp(6vw, 80px, 20px);
           line-height: calc(.2vh + 7vw);
           position: relative;
           height: auto;
           padding-top: 70px;
           padding-bottom: calc(20px + 3vw);
           width: 100%;
           text-wrap: nowrap;
           margin-left: 50px;
           margin-right: 50px;
           text-align: center;
           width: 100%;
           margin: 0;
           color: rgb(255, 255, 255) !important;
       }

       .highlight {
           color: yellowgreen;
       }

       #highlight1 {
           color: yellowgreen;
       }

       #highlight2 {
           color: yellowgreen;
       }

       #highlight3 {
           color: yellowgreen;
       }

       #highlight4 {
           color: yellowgreen;
       }

       .Cblock2_AboutsubVideo {
           display: block;
           text-align: center;
           position: relative;
           top: 80px;
           z-index: 22;
           width: 100%;
           font-size: clamp(5vw, 80px, 20px);
           line-height: calc(10px + 5vw);
           line-height: clamp(8.8vw, 80px, 33px);
           font-weight: 800;
           text-wrap: nowrap;
           margin-left: 0px;
           margin-right: 0px;
           margin-top: 1vh;
           margin-bottom: 0px;
           color: rgb(255, 255, 255) !important;
       }

       .Cblock2_AboutDesktop {
           position: absolute;
           top: 210px;
           display: flex;
           align-items: center;
           justify-content: center;
           text-align: center;
           z-index: 22;
           width: 100%;
           font-size: clamp(10vw, 80px, 35px);
           line-height: calc(.2vh + 8vw);
           font-weight: 800;
           text-wrap: nowrap;
           /* transform: translateY(calc(70px - 2vh)); */
           margin-top: clamp(2vw, 50px, 160px);
           margin-left: 0px;
           margin-right: 0px;
           margin-bottom: 0px;
           color: rgb(255, 255, 255) !important;
       }

       /*         .Cblock2_AboutMobile > * {
            display: none;
            text-align:center;
            position: absolute;
            top: 100vh;
            translate: 0px -80%;
            z-index: 22;
            width: 100%;
            font-size: clamp(7vw, 80px, 20px);
            line-height: calc(.2vh + 8vw);
            font-weight: 800;
            text-wrap: nowrap;
            margin-left: 0px;
            margin-right: 0px;
            margin-bottom: 0px;
            color: rgb(255, 255, 255) !important;
        } */

       #highlight {
           color: yellowgreen;
       }

       .Cblock2 p i {
           font-weight: 100;
           color: rgb(216, 216, 216);
       }


       .Cblock3 {
           position: relative;
           color: rgb(255, 255, 255) !important;
           font-size: 16px !important;
           height: min-content;
           overflow: hidden;
           margin-top: -80px;
           display: flex;
           flex-direction: row;
           align-items: center;
           justify-content: center;
           padding-left: 40px;
           padding-right: 40px;
       }







       .spacerLogoOben {
           position: relative;
           height: 150px;
           background-color: #222222;
       }

       .HeadFonts_About {
           position: absolute;
           width: 100%;
           height: calc(100vh - 0px);
           width: 70%;
           background-image: url(../Web_Icons/kreaZuver_Farbe.svg);
           background-repeat: no-repeat;
           background-size: contain;
           background-position: center;
           overflow: hidden;
       }

       .KreativMaske {
           position: absolute;
           width: 100%;
           height: calc(100vh - 150px);
           width: 100%;
           background-image: url(../Web_Icons/kreaZuver_MaskeINV.svg);
           background-repeat: no-repeat;
           background-size: contain;
           background-position: center;
           overflow: hidden;
       }

       /* .cinemaframe {
    position: absolute;
    height: 150px;
    width: 100%;
    background-color: #222222;
    z-index: 1;
} */
       .AboutVideoContainer {
           position: relative;
           margin: auto;
           display: flex;
           justify-content: center;
           /* translate: 0px 160px; */
           translate: 0px 0px;
           /* height: calc(100vh - 200px); */
           /* height: 100vh; */
           height: min-content;
           /* border-radius: 10px; */
           background-color: #222222;
           background-color: #000000;
           width: 100%;
           /* width: calc(100% - 80px); */
           overflow: hidden;
       }

       #video {
           position: relative;
           left: 50%;
           top: -90px;
           background-color: #222222;
           translate: -50% 0%;
           align-items: center;
           justify-items: center;
           filter: opacity(.8);
           scale: 1.1;
           z-index: -5;
           overflow: hidden !important;
       }






       /* Client Logo Slider About ----------------------------------------------- */
       .LogoSliderContainer {
           width: 100%;
           margin-top: 40px;
           overflow: hidden;
       }

       .LogoSlider {
           position: relative;
           display: flex;
           flex-direction: row;
           min-width: 271%;
       }

       .SliderLogo {
           display: flex;
           flex-direction: row;
           animation: SlideIt 17750ms infinite linear;
       }

       .SliderLogoOb {
           width: 180px;
           filter: invert();
       }

       @keyframes SlideIt {
           0% {
               transform: translateX(0%);
           }

           50% {
               transform: translateX(-50%);
           }

           100% {
               transform: translateX(-100%);
           }
       }



       .DetailLi {
           transform: translate(-0px, 4px);
       }

       .DetailLi p {
           /*             border: 1px solid rgb(70, 70, 70); */
           border-radius: 15px;
           background-color: rgba(180, 180, 180, 0.241);
           padding: 3px;
           margin-bottom: 6px;
       }




       /* Masonry Gallerie -------------------------------------------------------- */

       .hRoundedFrame {
           margin: auto;
           margin-top: 130px;
           display: flex;
           flex-direction: column;
           justify-content: center;
           min-width: 174px;
           max-width: 1000%;
           color: rgb(156, 156, 156);
           line-height: 21px;
       }

       #hr1000 {
           margin: auto;
           transform-origin: center;
           margin: 0px 40px 0px 40px;
           border: none;
           height: 1px;
           background-color: #7f8c8d31;
       }

       .h2Auswahl {
           font-size: 22px !important;
           text-align: center;
           font-family: "Open sans", sans-serif;
           font-weight: 100;
           padding: 7px;
       }

       .MasonryTags {
           position: relative;
           margin: 50px 40px 50px 40px;
       }

       .MasonryTags ul {
           position: relative;
           display: flex;
           flex-direction: row;
           flex-wrap: wrap;
           transform: translateX(-3%);
           justify-content: center;
       }

       .MasonryTags li {
           list-style-type: none;
           text-decoration: none;
           font-style: italic;
           padding: 0px 5px;
           color: rgb(156, 156, 156);
           line-height: 20px;
           margin: 0px;
           transition: .6s;
           cursor: pointer;
       }

       .MasonryTags li:hover {
           color: greenyellow;
           transition: .6s;
       }






       body {
           margin: 0;
           font-family: "Open sans", sans-serif;
       }

       section {
           position: relative;
           max-width: 90%;
           margin: auto;
           padding: 0px 40px;
           column-width: 390px;
           column-gap: 5px;

       }

       .sectImgLight {
           border-radius: 5px;
           display: block;
           width: 100vw;
           height: 100vh;
           padding: 2px 2px;
           cursor: pointer;
           transition: .5s;
           z-index: 1000000 !important;
       }

       .sectImg {
           border-radius: 5px;
           width: 100%;
           padding: 2px 2px;
           cursor: pointer;
           transition: .5s;
           z-index: 0;
       }

       .sectImg:hover {
           filter: brightness(80%);
           cursor: pointer;
           transition: .5s;
           z-index: 1;
       }

       .lightbox {
           position: fixed;
           width: 100%;
           height: 100%;
           top: 0;
           display: none;
           border-radius: 20px;
           background: #7f8c8d;
           perspective: 1000;
           z-index: 2;
       }

       .filter {
           position: absolute;
           width: 100%;
           height: 100%;
           filter: blur(20px);
           opacity: 0.5;
           background-position: center;
           background-size: cover;
       }

       .lightbox img {
           position: absolute;
           top: 50%;
           left: 50%;
           transform: translate(-50%, -50%) rotateY(0deg);
           max-height: 95vh;
           max-width: calc(95vw - 100px);
           transition: 2.8s cubic-bezier(0.7, 0, 0.4, 1);
           transform-style: preserve-3d;
       }


       [class^="arrow"] {
           height: 50px;
           width: 50px;
           background: rgba(0, 0, 0, 0.4);
           margin: 20px;
           border-radius: 10px;
           position: absolute;
           top: 50%;
           transform: translateY(-50%);
           cursor: pointer;
       }

       [class^="arrow"]:after {
           content: '';
           position: absolute;
           top: 50%;
           left: 50%;
           transform: translate(-50%, -50%) rotate(-45deg);
           width: 15px;
           height: 15px;
       }

       .arrowr {
           right: 0;
       }

       .arrowr:after {
           border-right: 1px solid white;
           border-bottom: 1px solid white;
       }

       .arrowl {
           left: 0px;
       }

       .arrowl:after {
           border-left: 1px solid white;
           border-top: 1px solid white;
       }

       .close {
           position: absolute;
           right: 10px;
           width: 30px;
           height: 30px;
           background: rgba(0, 0, 0, 0.4);
           border-radius: 10px;
           margin: 20px;
           scale: .7;
           cursor: pointer;
       }

       .close:after,
       .close:before {
           content: '';
           position: absolute;
           top: 50%;
           left: 50%;
           width: 1px;
           height: 100%;
           background: #ffffff;
       }

       .close:after {
           transform: translate(-50%, -50%) rotate(-45deg);
       }

       .close:before {
           transform: translate(-50%, -50%) rotate(45deg);
       }

       .title {
           font-size: 20px;
           color: #000;
           z-index: 1000;
           position: absolute;
           top: 0;
           left: 0;
       }









       /* Mobile Menu Top ------------------------------------------------------------ */
       /*  slide from right */
       .mobileMenu {
           display: none;
           /* WIEDER AUF DISPLY NONE STELLEN!!! */
           position: fixed;
           width: 100%;
           height: 100%;
           /*100%*/
           max-width: 100%;
           margin: auto;
           right: 0;
           /* to animate from right */
           background-color: #1e1e1e;
           z-index: 500;
       }

       .mobileMenuInnerFrame {
           /*border: 1px solid red;*/
           width: 100%;
           height: 100%;
           position: relative;
           margin: auto;
           /* transform: translateX(-12vw); */
       }

       .mobilelogo {
           position: absolute;
           height: auto;
           transform-origin: center;
           width: 160px;
           margin: 0;
           filter: invert(100%) opacity(30%);
           right: 50%;
           transform: translate(50%, 25%);
       }

       .flexUl {
           margin-top: 47vh;
           position: absolute;
           width: 100%;
           left: 0px;
           top: 00px;
           display: flex;
           transform-origin: bottom;
           flex-direction: row;
           align-items: flex-end;
       }

       .flexUl a,
       .flexUl li,
       .flexUl ul {
           font-family: "Poppins", sans-serif;
           font-weight: 800;
           font-weight: 200;
           list-style-type: none;
           text-decoration: none;
           color: white;
           text-align: left;
       }

       #mobileMenuLeft {
           margin-left: 0;
           width: 40%;
           font-size: 22px;
           translate: 15px 17px;
           line-height: 40px;
           text-wrap: nowrap;
       }

       #mobileMenuLeft a {
           font-family: "Poppins", sans-serif;
           font-weight: 300;
       }

       #mobileMenuLeft hr {
           position: absolute;
           height: 1px;
           border: none;
           translate: 0px 1px;
           background-color: rgb(93, 93, 93);
           width: 110px;

       }

       .mobileMenuRight {
           width: 40%;
           font-size: 13px;
           line-height: 20px;
           margin-left: 20px;
           translate: -20px 11px;
           text-wrap: nowrap;
       }

       .mobileMenuRight a {
           font-family: "Poppins", sans-serif;
           font-weight: 300;
           color: rgb(151, 151, 151);
       }

       .socialsMobile {
           position: fixed;
           transform-origin: bottom left;
           scale: 2;
           left: 50px;
           bottom: 30px;
           transition: 10ms;
       }

       #facebookMobilMenu {
           margin-left: -2vw;
       }



















       /* Media Screen ------------------------------------------------------------ */

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

           .mobileMenu,
           .flexUl {
               display: none;
           }
       }


       @media screen and (max-width: 680px) {
           .Cblock1 {
               display: flex;
               flex: auto;
               margin: auto;
               margin-top: 0px;
               padding-left: 40px;
               padding-right: 40px;
               columns: 1;
           }

           .Cblock1 p {
               color: rgb(160, 160, 160);
               columns: 1;
           }

           .Cblock1Index #ColumnTWO {
               columns: 1;
           }

           .Cblock1_About p {
               columns: 1;
           }

           .Cblock1_About2 p {
               columns: 1;
           }

           .Cblock1FlexCol {
               flex-direction: column;
           }

           .Cblock1_AboutsubVideo {
               flex-direction: column;
           }




           /*                 .Cblock2_AboutDesktop > * {
                    display: none;
                } */
           .Cblock2_AboutMobile>* {
               display: block;
               text-align: center;
               position: absolute;
               top: 60vh;
               translate: 0px -50%;
               z-index: 22;
               width: 100%;
               font-size: clamp(10vw, 80px, 20px);
               line-height: calc(1.5vh + 8vw);
               font-weight: 800;
               text-wrap: nowrap;
               margin-left: 0px;
               margin-right: 0px;
               margin-bottom: 0px;
               color: rgb(255, 255, 255) !important;
           }

           .AboutFlexPhoto {
               flex-direction: column;
               overflow: hidden;
           }

           .profilfototext {
               width: calc(100% - 80px);
               margin: auto;
           }

           .profilbild {
               position: relative;
               display: block;
               background-size: cover;
               background-position: center;
               width: calc(100% - 80px);
               margin: auto;
               height: 400px;
               margin-top: 20px;
               overflow: hidden;
           }

           .KontaktContainer {
               position: relative;
               display: flex;
               flex-direction: column;
               justify-content: center;
               align-items: left;
               padding-top: 80px;
               margin-left: 0px;
               margin-right: 0px;
           }

           .KontaktTable {
               margin: auto;
           }

           .headermenuItem {
               display: none;
           }

           .MobileMenubarBox {
               background-color: rgba(153, 205, 50, 0.84);
               background-color: rgba(153, 205, 50, 0.84);
               background-color: rgb(83, 81, 81);
               background-color: rgb(56, 53, 53);
               background-color: #222222;
               width: 150px;
               height: 100px;
               translate: -7px -94px;
               z-index: -1;
               border-radius: 5px;
               position: fixed;
           }

           .MobileMenubar {
               display: block;
               position: fixed;
               /* absolute*/
               right: 40px;
               top: 62px;
               width: 40px;
               height: 30px;
               z-index: 500000;
               transition: 1s;
               transform-origin: center;
           }


           .MobileMenubar hr {
               border: none;
               border-radius: 5px;
               margin-top: 6px;
               height: 3px;
               background-color: white;
           }

           .MobileMenubar:active hr {
               background-color: white;
           }

           .mobileBack {
               position: sticky;
               top: 60px;
               float: right;
               margin-right: 40px;
               padding: 0px;
               margin-right: auto;
               width: 60px;
               translate: -40px 0px;
               height: 37px;
               border-radius: 8px;
               background-color: rgba(34, 34, 34, 0.48);
               z-index: 1;
               display: block;
           }





       }



       /* Wide Footer - Desktop */
       @media screen and (min-width: 920px) {
           .footerContainer_Desktop {
               display: flex;
           }

           .footerWide {
               display: block;
           }

           .footerContainer_Tablet {
               display: none;
           }

           .footerMedium {
               display: none;
           }

           .footerContainer_Mobile {
               display: none;
           }

           .footerSmall {
               display: none;
           }
       }

       /* Medium Footer - Tablet */
       @media screen and (max-width: 920px) {
           .footerContainer_Desktop {
               display: none;
           }

           .footerWide {
               display: none;
           }

           .footerContainer_Tablet {
               display: flex;
           }

           .footerMedium {
               display: block;
           }

           .footerContainer_Mobile {
               display: none;
           }

           .footerSmall {
               display: none;
           }
       }

       /* Small Footer - Mobile */
       @media screen and (max-width: 720px) {
           .footerContainer_Desktop {
               display: none;
           }

           .footerWide {
               display: none;
           }

           .footerContainer_Tablet {
               display: none;
           }

           .footerMedium {
               display: none;
           }

           .footerContainer_Mobile {
               display: flex;
           }

           .footerSmall {
               display: block;
           }
       }












       /* Animation css -------------------------------------------------------- */
       .reveal {
           position: relative;
           transform: translateX(-50px);
           opacity: 0;
           transition: 1.5s all ease;
       }

       .reveal.active {
           transform: translateY(0);
           opacity: 1;
       }

       .reveal2 {
           position: relative;
           transform: translateX(-50px);
           opacity: 0;
           transition: 1.5s all ease;
       }

       .reveal2.active {
           transform: translateY(0);
           opacity: 1;
       }

       .reveal3 {
           position: absolute;
           transform: translateX(-50px);
           opacity: 0;
           transition: 1.5s all ease;
       }

       .reveal2.active {
           transform: translateY(0);
           opacity: 1;
       }

       .reveal4 {
           position: relative;
           transform: translateX(-50px);
           opacity: 0;
           transition: 1.5s all ease;
       }

       .reveal4.active {
           transform: translateY(0);
           opacity: 1;
       }

       /* fade and delay on pageload */
       .fade {
           animation: fadeInAnimation ease 3s, example ease 1.5s;
           animation-iteration-count: 1;
           animation-fill-mode: forwards;
           position: relative;
           text-align: center;
       }

       .delayani {
           opacity: 0;
           animation: fadeInAnimation ease 3s;
           animation-delay: 1s;
           animation-iteration-count: 1;
           animation-fill-mode: forwards;
           position: relative;
           text-align: center;
       }

       @keyframes fadeInAnimation {
           0% {
               opacity: 0;
           }

           20% {
               opacity: 0;
           }

           100% {
               opacity: 1;
           }
       }

       @keyframes example {
           0% {
               background-color: 0px;
               top: 100%;
           }

           100% {
               background-color: 0px;
               top: 50%;
           }
       }