/*HEADER*/
:root {
  --home-button-color: rgba(218, 212, 200, 1);
  --bg-color-transp: rgba(255, 247, 241, 0.35);
  --bg-color: rgba(255, 247, 241, 0.98);
  --bg-color-two: rgba(255, 247, 241, 0.4);
  --bg-color-transparent: rgba(255, 242, 231, 0.9);
  --bg-color-transparent2: rgba(255, 242, 231, 0.9);
  --prm-color: black;
  --prm-gray: rgba(255, 247, 241, 0.98);
  --costs-font-size: clamp(0.813rem, 0.76625rem + 0.23375vw, 1rem);
  --costs-font-size-desktop: clamp(0.938rem, 0.86rem + 0.39vw, 1.25rem);
  --bg-color-input: rgba(255, 247, 241, 0.65);

  --text-color-2: white;
  --hover-button-color: rgba(34, 45, 50, 0.9);

}
.bg_tree_fade{
    background: url('backgrounds/bg_1_newTree.png');
    background-size: cover;
    background-repeat: repeat;
    background-position: center;
    height: 2000px;
    position: fixed;
    left: 0;
    right: 0;
    z-index: -1;
    filter:blur(20px);
    -webkit-filter: blur(20px);
    opacity: 0.6;
    
  }

.person-background {
  background-image: url('backgrounds/bg_1_newTree_mobile.png');
  position: absolute;
  background-size: 300%;
  
  
  background-repeat: repeat;
  background-position: center;
  height: 1000000000px;  
  filter:blur(15px);
  -webkit-filter: blur(15px);
  opacity: 0.25;
  left: 0;
  right: 0;
  z-index: -1;
}

.desktop-margin-personpage-left {
  background: url('backgrounds/bg_left.png');
  position:absolute;
  height:1000000000px;  
  background-size: 200%;
  left: -60%;
  right: 100%;
  z-index: -1;
  filter:blur(25px);
  -webkit-filter: blur(25px);
  opacity: 0.6;
  background-position-x: 45% !important;
  background-position-y: -300px !important;
}

.desktop-margin-personpage-right {
  background: url('backgrounds/bg_right.png');
  position:absolute;
  
  background-size: 200%;
  height:1000000000px;  
  left: 100%;
  right: -60%;
  z-index: -1;
  filter:blur(25px);
  -webkit-filter: blur(25px);
  opacity: 0.5;
  background-position-x: 35% !important;
  background-position-y: -300px !important;
}

@media (max-width:1000px) {
  .person-background {
    background-image: url('backgrounds/bg_1_newTree_mobile.png');
    position: absolute;
    background-size: 700%;
    margin-top:1px;
    background-repeat: repeat;
    background-position: center;
    height: 1000000000px;  
    filter:blur(8px);
    -webkit-filter: blur(8px);
    opacity: 0.28;
    left: 0;
    right: 0;
    z-index: -1;

    /*background-image: url('backgrounds/bg_3_newTree_mobile.png');
    position: absolute;
    background-size: 500%;
    margin-top:-30px;
    margin-left:-10%;
    width:120%;
    background-repeat: repeat;
    background-position-x: 80% !important;
    height: 1000000000px;  
    filter: saturate(40%) blur(10px);
    -webkit-filter: saturate(40%) blur(10px);
    
    opacity: 0.8;
    left: 0;
    right: 0;
    z-index: -1;*/
  }
}

/*.text_color {
  color: var(--text-color-2);
}*/



.costs-padding {
  padding-left:10px;
  padding-right:10px;
}

@media (max-width:576px){
  .costs-padding {
    padding-left:15px;
    padding-right:15px;
  }
}
.install-option-button-product {
  width:110px !important;
  height:80px;
  border:solid 1px rgb(20, 20, 20);
  box-shadow:2px 2px 2px 2px rgb(230, 230, 230);
  border-radius:20px;
  background-color: var(--bg-color-transp);
  margin: 0px 10px;
  
}

.ghosted {
  opacity: 0.3;
}


#accordion-scale {
  transform: scale(0.75);
  transform-origin: 50% 0%;
}

.alternativeAutofill:-webkit-autofill,
.alternativeAutofill:-webkit-autofill:hover, 
.alternativeAutofill:-webkit-autofill:focus, 
.alternativeAutofill:-webkit-autofill:active{
    -webkit-text-fill-color: grey;
    color: black;
    background-color: white;  
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}

.book-background {
    background: url('backgrounds/condolenceBook.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position-x: 25%;
    height:550px;
    


    
  }

html {
  height: 100%;
  box-sizing: border-box;
  overflow-x: hidden;
  overflow-y: auto;
}

body {
    width: 100vw;
    min-width: 100vw;
    max-width: 100vw;
   
    overflow-x: hidden;
    overflow-y: hidden;
    position: relative;
    min-height: 100%;
 }  

@font-face {
  font-family: "mainfont";
  /*src: url('fonts/Bahnschrift.ttf');*/
  src: url('fonts/OnestRegular1602-hint.ttf');
  font-style: normal;
}

@font-face {
  font-family: "Pathos";
  src: url('fonts/Pathos.ttf');
  font-style: normal;
}

@font-face {
  font-family: "Pristina";
  src: url('fonts/Pristina.ttf');
  font-style: normal;
}

@font-face {
  font-family: "Alvarado";
  src: url('fonts/Alvarado.otf');
  font-style: normal;
}

@font-face {
  font-family: "Weise";
  src: url('fonts/Weise.otf');
  font-style: normal;
}

@font-face {
  font-family: "Fagrak";
  src: url('fonts/Fagrak.otf');
  font-style: normal;
}

@font-face {
  font-family: "Hitmo";
  src: url('fonts/Hitmo.ttf');
  font-style: normal;
}


@font-face {
  font-family: "Avanti";
  src: url('fonts/Avanti.otf');
  font-style: normal;
}



@font-face {
  font-family: "Korrin";
  src: url('fonts/Korrin.otf');
  font-style: normal;
}

@font-face {
  font-family: "Book Antiqua";
  src: url('fonts/BookAntiqua.ttf');
  font-style: normal;
}

@font-face {
  font-family: "Courier New";
  src: url('fonts/CourierNew.ttf');
  font-style: normal;
}

@font-face {
  font-family: "Arial";
  src: url('fonts/Arial.ttf');
  font-style: normal;
}

@font-face {
  font-family: "Comic Sans MS";
  src: url('fonts/ComicSansMS.ttf');
  font-style: normal;
}

@font-face {
  font-family: "Helvetica";
  src: url('fonts/Helvetica.ttf');
  font-style: normal;
}

@font-face {
  font-family: "Impact";
  src: url('fonts/Impact.ttf');
  font-style: normal;
}

@font-face {
  font-family: "bradley";
  src: url('fonts/Bradley.ttf');
  font-style: normal;
}

@font-face {
  font-family: "Times New Roman";
  src: url('fonts/TimesNewRoman.ttf');
  font-style: normal;
}

.offcanvas-body a {
  margin-top: 0px;
}
.offcanvas-body a.nav-link.selected {
  margin-top: 0px;
}

#home-below {
  /*background-image: url("backgrounds/home_below.jpg");*/
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  /*background-color: var(--bg-color);*/
}

.caption-container {
  background: var(--bg-color);
  
  height: 65px;
  margin-right:-11px !important;
  margin-left:-11px !important;
  border-top: solid 0.5px rgba(0, 0, 0, 0.2);
  border-bottom: solid 0.5px rgba(0, 0, 0, 0.2);
}

.caption-container-vorschau {
  background: var(--bg-color);
  height: 44px;
  margin-right:-11px !important;
  margin-left:-11px !important;
  border-top: solid 0.5px rgba(0, 0, 0, 0.2);
  border-bottom: solid 0.5px rgba(0, 0, 0, 0.2);
}

.caption-container-vorschau-home {
  background: var(--bg-color);
  height: 50px;
  width: 387px;
  margin-right:-11px !important;
  margin-left:-11px !important;
  border-top: solid 0.5px rgba(0, 0, 0, 0.2);
  border-bottom: solid 0.5px rgba(0, 0, 0, 0.2);
  
}

#home-button {
  border: solid 1px white !important;
  background:transparent;
  padding:15px 15px 8px 15px;
  border-radius:30px;
  margin-top:5px;
}

.formular-button {
  border: solid 1px black;
  background:transparent;
  padding:10px 10px 10px 10px;
  border-radius:30px;
}

.formular-button a:link { text-decoration: none; }
.formular-button a:visited { text-decoration: none; }
.formular-button a:hover { text-decoration: none; }
.formular-button a:active { text-decoration: none; }

.home-padding {
  padding:0px 60px;
}

.container-ingrid {
  background-image: url("backgrounds/smartphone.png");
  background-repeat: no-repeat;
  width:431px;
  height:879px;
  transform: scale(0.6);
  /*transform-origin: 50% 0%;*/
  left: 0;
  right: 0;
  z-index: -1;
  border: solid 1px transparent;
}

.row-ingrid {
  width: 389px; 
  margin-top:92px;
  height:700px;
  overflow-y: scroll;
  overflow-x:hidden;  
  scrollbar-width: none;
 
}

.row-ingrid::-webkit-scrollbar {
  display: none; 
}
.row-ingrid::-webkit-scrollbar-thumb {
  display: none;
}
.row-ingrid::-webkit-scrollbar-track {
  display: none;
}


.product-preview-main {
  width:100%;
  border-radius:10px;
}

.product-preview-thumbnail {
  width:100px !important;;
  border-radius:5px;
  text-align:center;
  padding:0 !important;
  margin:0 !important;
  cursor:pointer;
}

.product-preview-thumbnail-selected {
  width:100px !important;
  border-radius:5px;
  border: solid 3px black;
  padding:0 !important;
  margin:0 !important;
  cursor:pointer;
}
.container-ingrid-mobile {
  background-image: url("backgrounds/smartphone.png");
  background-repeat: no-repeat;
  width:431px;
  height:879px;
  transform-origin: 0% 0%;
  left: 0;
  right: 0;
  z-index: -1;
  border: solid 1px transparent;
  margin-top:-18px;
 
}

.person-card {
  background:var(--bg-color-transp);
  border-radius:8px;
  padding:10px 10px;
  margin-top:10px;
  margin-bottom:10px;
  border:solid 1px rgb(225,225,225);
}

.person-card-picture {
  background:var(--bg-color-transp);
  border-top-left-radius:8px;
  border-top-right-radius:8px;
  border:solid 1px rgb(225,225,225);
  border-bottom:none;
  padding-top:10px;  
}

.person-card-form {
  background:var(--bg-color-transp);
  border-bottom-left-radius:8px;
  border-bottom-right-radius:8px;
  border:solid 1px rgb(225,225,225);
  border-top:none;
  padding-top:5px;
  margin-bottom:5px; 
}

.container-erich {
  background-image: url("backgrounds/erich.png");
  background-repeat: no-repeat;
  width:431px;
  height:879px;
  transform: scale(0.6);
  transform-origin: 0% 50%;
  left: 0;
  right: 0;
  z-index: -1;
}



.container-picture {
  /*background-image: url("backgrounds/optimized/new_front2.jpg");*/
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  height:100%;

  position: static;
  left: 0;
  right: 0;
  z-index: -1;
}
.bg_tree_fade_2{
  background: url('backgrounds/bg_1_new_home.png');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  
  position: static;
  left: 0;
  right: 0;
  z-index: -1;
  /*filter:blur(1px);
  -webkit-filter: blur(7px);
  opacity: 0.3;*/
  
}

.down-arrow {
  position: absolute;
  top: calc(var(--vh, 1vh)*90);
  /*top: calc(90vh - 30px);*/
  left: calc(50% - 14px);
  width: 0;
  height: 30px;
  border: 2px solid;
  border-radius: 2px;
  animation: jumpInfinite 1.5s infinite;
  color: white;
}

.down-arrow:after {
  content: " ";
  position: absolute;
  top: 12px;
  left: -8px;
  width: 16px;
  height: 16px;
  border-bottom: 4px solid;
  border-right: 4px solid;
  border-radius: 4px;
  transform: rotateZ(45deg);
  

}

@keyframes jumpInfinite {
  0% {
    margin-top: 0;
  }
  50% {
    margin-top: 20px;
  }
  100% {
    margin-top: 0;
  }
}

.change-package-button {
  min-width:85px;
  background-color: var(--bg-color-transp);
  border-radius:20px;
  padding: 10px 10px 10px 10px !important;
  box-shadow: 2px 2px 2px 2px rgb(239, 239, 239);
  border: solid 1px lightgrey;
  height:44px;
  align-items: center;
  margin-left:-10px;
  margin-top:8px;
}


.priceContainer {
  min-height:50px;
  width:95%;
  border:solid 1px rgb(230, 230, 230);
  border-radius:30px;
  background-color: var(--bg-color-transp);
  margin:0px 1% 0px 1%;
  padding-top:5%;
  padding-bottom:5%;
  transition: background-color 0.3s ease, color 0.3s ease;
  
}


.priceContainer:hover {
    background-color: var(--hover-button-color) !important;
    color: var(--bg-color) !important;
    border:solid 1px var(--bg-color) !important;
}

.priceContainer img {
  transition: transform 0.5s ease-in-out, border 0.5s ease-in-out, opacity 0.5s ease-in-out;
  border: 1px solid transparent; 
  opacity: 1;
}

.priceContainer:hover img {
  border: 1px solid var(--bg-color); 
  transform: scale(1.02);
  opacity: 0;
}

.priceContainer #img2 {
  transition: transform 0.5s ease-in-out, border 0.5s ease-in-out, opacity 0.5s ease-in-out;
  opacity: 0;
  border: 1px solid transparent; 
}

.priceContainer:hover #img2 {
  opacity: 1;
  border: 1px solid var(--bg-color); 
  transform: scale(1.02);
}

.orderContainer {
  width:95%;
  min-height:300px;
  position: relative;
  border:solid 1px grey;
  border-radius:30px;
  background-color: var(--bg-color-transp);
  margin:20px 10px;
  padding: 10px 40px;
 
}

.orderContainer::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 70px;
  background-color: rgb(236, 236, 236);
  border-top-left-radius: 30px;
  border-top-right-radius: 30px;
  border-bottom: solid 1px lightgrey;
  z-index:-1 !important;
}

.plaque-preview {
 
  text-align:center;
  border:solid 1px grey;
  border-radius:10px;
  background-color: rgb(250, 250, 250);
  margin:0px 1% 0px 1%;
  width: 100%;
}

.plaque-motiv-img {
  width: 86%;
  margin: 12% 0% 12% 0%;
  
}


.combi-preview {
 
  text-align:center;
  border:solid 1.5px black;
  border-radius:10px;
  background-color: white; 
  margin:0px 1% 0px 1%;
  width: 100%;
}
.combi-motiv-img {
  width: 80%;
  margin: 5px;
  
}

.tafel-img {
  border-radius:10px;
  width:100%;
}


.custom-name-qr {
  font-family: "mainfont";
  /*font-size: 7px;*/
  font-size: clamp(0.375rem, -0.351rem + 1.5106vw, 0.6875rem);
  
  margin: 0;
  padding: 0% 0% 4% 0%;
  color:black;
}


.package-header {
  height:30px;
  display:flex;
  justify-content:center;
  align-items: center;
}



.order-package-button {
  border:transparent;
  border-radius:30px;
  width:100%;
  background-color: var(--bg-color-transp);
  height:44px;
  margin-top:10px;
  border-radius:20px;
  box-shadow: 2px 2px 2px 2px rgb(239, 239, 239);
  border: solid 1px lightgrey;
}

.order-package-button-active {
  border:solid 1px grey;
  border-radius:30px;
  width:100%;
  background-color: var(--bg-color-transp);
  height:45px;
  margin-top:10px;
  background-color:#a7cdff;
  box-shadow: 2px 2px 2px 2px lightgrey;
}


.order-button-table {
  
  background-color: transparent;
  border:transparent;
}


.order-now-button {
  margin-top:5px !important;
  margin-bottom:5px !important;
  width:80%;
  height:40px;
  border:solid 1px rgb(20, 20, 20);
  box-shadow:2px 2px 2px 2px rgb(230, 230, 230);
  border-radius:20px;
  background-color: var(--bg-color-transp) !important;
  color: black;
  transition: background-color 0.3s ease, color 0.3s ease;
}

.order-now-button:hover {
  background-color: var(--hover-button-color) !important;
  color: var(--bg-color) !important;
  border:solid 1px var(--bg-color) !important;
}


.order-now-button-detail {
  margin-top:10px !important;
  margin-bottom:20px !important;
  width:45%;
  height:50px;
  border:solid 1px rgb(20, 20, 20);
  box-shadow:2px 2px 2px 2px rgb(230, 230, 230);
  border-radius:20px;
  background-color: var(--bg-color-transp) !important;
  transition: background-color 0.3s ease, color 0.3s ease;
}

.order-now-button-detail:hover {
  background-color: var(--hover-button-color) !important;
  color: var(--bg-color) !important;
  border:solid 1px var(--bg-color) !important;
}


.green-icon {
  /*green fill
  fill:#93C572;*/

  /*black fill*/
  fill:#000;

 
  /*OLD HAKEN
  d: path("M 18.217641,74.179756 C 15.709411,66.697913 13.416131,60.968439 11.057376,56.29073 8.4981526,51.215464 6.4044452,48.342363 3.240079,45.563371 2.4410018,44.861615 1.6858962,44.134114 1.5620684,43.94671 1.3414915,43.612892 1.3523618,43.587269 2.0980446,42.683451 3.9815458,40.400538 6.954542,37.903584 8.9256114,36.94914 c 0.9686505,-0.469051 1.1532196,-0.511208 2.2402876,-0.511689 1.145631,-5.11e-4 1.211583,0.01707 2.001428,0.533008 1.16037,0.758003 3.141756,2.772993 4.446899,4.522326 1.551116,2.079026 2.961276,4.472581 4.588114,7.787725 1.096662,2.234755 1.444182,2.828412 1.655715,2.828412 0.315476,0 0.78304,-0.878487 2.003353,-3.764014 3.57014,-8.441895 8.625504,-15.850383 15.72576,-23.045629 C 48.206427,18.591466 56.963812,12.022541 66.646639,6.5021375 70.735255,4.17113 76.164205,1.3575313 76.16848,1.5673682 c 9.37e-4,0.057038 0.06234,0.011316 0.135918,-0.1015997 0.118932,-0.1824985 0.133669,-0.1824985 0.132638,0 -0.0028,0.4194215 -0.664894,1.7852306 -1.272928,2.6241815 -0.685397,0.9456994 -3.191297,3.4363322 -5.899219,5.8632568 -2.599537,2.3297922 -7.412871,7.1738382 -9.663655,9.7253122 -8.172816,9.264647 -16.101768,20.90953 -24.318432,35.715366 -2.866222,5.164726 -3.011763,5.439545 -6.124826,11.565801 l -2.921201,5.748682 -3.5728,1.806939 c -1.965039,0.993822 -3.606736,1.80993 -3.648216,1.813577 -0.04148,0.0037 -0.400633,-0.963455 -0.798118,-2.149128 z M 23.95384,52.436849 c -0.04586,-0.04547 -0.164917,-0.05034 -0.264556,-0.01081 -0.110112,0.04372 -0.0774,0.07612 0.08339,0.0827 0.145506,0.0059 0.22703,-0.02638 0.181164,-0.07189 z M 11.566025,36.742441 c 0.516353,0.01609 0.691679,-0.01718 0.552118,-0.104664 -0.296887,-0.186156 -1.369501,-0.142112 -1.929868,0.07924 l -0.483103,0.190833 0.552117,-0.09449 c 0.303666,-0.05197 0.892597,-0.08389 1.308736,-0.07092 z M 76.045939,1.7737335 c 0.171694,-0.2170894 0.166809,-0.2219306 -0.05213,-0.051675 -0.229922,0.1788075 -0.303038,0.2912053 -0.189431,0.2912053 0.02869,0 0.137362,-0.1077872 0.241547,-0.2395275 z");
  */

  /*big plus
  d: path("M 37.38498,74.550876 C 34.766415,73.58919 32.804366,71.697247 31.902814,69.264609 31.414774,67.94773 31.380387,67.224529 31.380387,58.277615 V 48.7003 h -9.181524 c -7.286804,0 -9.488079,-0.08061 -10.66703,-0.390623 C 6.6808114,47.034057 3.9078045,42.183095 5.329118,37.458976 6.051093,35.059297 7.5895612,33.289392 9.9917423,32.094937 l 1.7329427,-0.861677 9.827851,-0.0827 9.827851,-0.0827 v -9.693961 c 0,-9.613638 0.0049,-9.705576 0.613523,-11.094518 3.096485,-7.0686517 12.578841,-7.1835713 15.982924,-0.193684 l 0.70514,1.44793 0.07955,9.784181 0.07955,9.784162 h 8.795899 c 4.861966,0 9.418607,0.119228 10.188234,0.26658 2.896012,0.554475 5.246962,2.363623 6.449749,4.96335 0.555221,1.200073 0.679662,1.855965 0.681884,3.594153 0.002,1.914071 -0.08811,2.306133 -0.907894,3.930047 -0.663801,1.314952 -1.263193,2.07275 -2.211483,2.795961 -2.463984,1.879146 -2.518117,1.887227 -13.316933,1.987553 l -9.6745,0.08984 -0.08201,9.769598 -0.08201,9.769598 -0.714128,1.468033 c -0.920038,1.891327 -2.559161,3.545956 -4.345036,4.386151 -1.808984,0.851056 -4.570122,1.04053 -6.23783,0.428049 z");
  */

  /*thin plus*/
  d: path("m 38.371508,62.621119 -0.649432,-0.649432 v -9.933902 -9.933901 h -9.933901 -9.933902 l -0.649432,-0.649432 c -0.859193,-0.859194 -0.859193,-2.075276 0,-2.93447 l 0.649432,-0.649432 h 9.933902 9.933901 v -9.933901 -9.933902 l 0.649432,-0.649432 c 0.859194,-0.859194 2.075276,-0.859194 2.93447,0 l 0.649431,0.649432 v 9.933902 9.933901 h 9.933902 9.933902 l 0.649431,0.649432 c 0.859194,0.859194 0.859194,2.075276 0,2.93447 l -0.649431,0.649432 h -9.933902 -9.933902 v 9.933901 9.933902 l -0.649431,0.649432 c -0.409373,0.409373 -0.951728,0.649432 -1.467235,0.649432 -0.515507,0 -1.057862,-0.240059 -1.467235,-0.649432 z");
  

  /*new haken
  d: path("M 33.670221,63.288604 C 32.378485,62.996069 31.841631,62.744479 31.352036,62.202215 31.165717,61.995854 29.795029,59.477426 28.306062,56.60571 24.58259,49.424388 22.70016,46.431016 19.880412,43.207549 c -1.498374,-1.712905 -1.245215,-2.53988 1.00575,-3.285394 1.152688,-0.381767 4.171147,-0.351692 5.105865,0.05087 1.229264,0.529422 4.297643,4.474356 7.089591,9.114902 l 1.401299,2.329124 0.425136,-0.971541 c 0.233824,-0.534348 0.425135,-1.006933 0.425135,-1.05019 0,-0.280271 2.885099,-6.38493 4.698718,-9.942145 3.420812,-6.709549 6.74836,-12.362779 10.741682,-18.249237 3.777963,-5.569001 4.617643,-6.634339 5.499592,-6.977561 2.588102,-1.007193 7.069726,-0.274366 7.287518,1.191643 0.03374,0.227104 -0.32344,0.952044 -0.79916,1.621999 -10.189811,14.350275 -17.171566,27.435486 -22.46586,42.105531 -0.559028,1.54902 -1.106447,2.981189 -1.216485,3.182598 -0.49144,0.899504 -3.398639,1.415726 -5.408972,0.960453 z");
  */

}
.red-icon {
  /*fill:#9f9f9f;
  d: path("M 53.244034,77.317789 C 52.359972,76.89751 52.114895,76.417197 51.280579,73.469722 49.823811,68.323258 47.070095,60.493139 45.029679,55.69546 43.895788,53.029314 41.520951,47.888436 41.26722,47.550757 c -0.141347,-0.188112 -0.973609,0.592055 -3.559129,3.33635 -4.773302,5.066426 -7.434934,7.638858 -11.592793,11.204279 -4.905658,4.206669 -10.747702,8.614222 -13.131484,9.907102 -1.560141,0.846165 -3.5827605,1.629559 -4.0111114,1.55357 -0.30726,-0.05451 1.3763254,-1.666034 5.7296294,-5.484393 4.893143,-4.291861 12.81386,-12.642176 17.397005,-18.34057 4.185889,-5.204471 6.104893,-7.833469 5.977968,-8.189699 -0.13924,-0.39079 -4.070075,-6.836449 -5.1211,-8.397417 -3.66403,-5.441768 -7.226126,-10.217481 -10.55058,-14.145195 -2.942418,-3.476353 -4.583722,-5.623273 -5.037047,-6.588748 -0.421061,-0.896758 -0.426954,-0.955117 -0.13276,-1.314634 0.169323,-0.206921 1.023635,-0.73582 1.89847,-1.1753316 1.630111,-0.8189579 5.654203,-2.3770373 6.139235,-2.3770373 0.549792,0 3.192775,1.5880856 4.515038,2.7129439 2.527924,2.150524 8.597387,8.827157 12.154978,13.370922 0.491799,0.628127 1.636181,2.188993 2.54307,3.46859 0.90689,1.279597 1.705248,2.289029 1.774127,2.243181 0.296084,-0.197079 3.383778,-5.735253 5.200778,-9.328261 1.520191,-3.006088 4.704976,-9.893351 5.159768,-11.1582662 0.164775,-0.458291 0.456952,-1.0220075 0.649282,-1.2527036 0.784661,-0.9411878 7.905288,-4.2617527 10.34956,-4.8263147 1.794162,-0.414403 1.802064,-0.532101 -0.262767,3.9133713 -1.87037,4.0268122 -2.548456,5.3724032 -4.985623,9.8934922 -2.837113,5.263014 -6.319245,10.893709 -10.002813,16.174798 l -2.178393,3.123138 0.395088,0.631615 c 1.686674,2.696433 4.850858,8.806553 6.80477,13.140185 2.909896,6.453938 4.557889,10.948736 6.801716,18.551267 0.751069,2.544753 0.76863,3.098029 0.13789,4.343702 -0.452999,0.894654 -0.609031,1.02025 -2.602704,2.09505 -2.194402,1.183015 -6.735644,2.963383 -7.511214,2.944729 -0.24301,-0.0058 -0.680428,-0.124052 -0.97204,-0.262683 z");
  */
  fill:#000;
  
  d: path("m 13.01694,41.805923 c -0.578933,-0.57463 -0.960923,-1.341446 -0.956205,-1.91951 0.0046,-0.557458 0.458358,-1.415364 1.023603,-1.935081 l 0.493084,-0.453368 h 26.61384 26.613841 l 0.557663,0.52208 c 0.736525,0.689535 0.960495,1.132228 0.960495,1.898521 0,0.768745 -0.144277,1.060701 -0.89869,1.818647 l -0.58133,0.584048 H 40.189688 13.536136 Z");
  /*d: path("M 13.159274,48.540269 C 7.3109447,47.87827 3.8607187,41.44774 6.2938792,35.744545 c 0.8440304,-1.97836 2.180368,-3.330048 4.5443988,-4.596597 l 1.34033,-0.718093 27.026866,0.0013 c 17.735316,8.57e-4 27.392293,0.063 28.089807,0.180755 2.999614,0.506371 5.72293,2.986098 6.711048,6.110773 0.3025,0.956579 0.342862,1.406545 0.287387,3.2039 -0.06245,2.0234 -0.08544,2.135775 -0.710604,3.474631 -1.083625,2.320669 -2.883769,4.079712 -4.816067,4.706106 -0.627595,0.203447 -1.961972,0.338983 -4.415294,0.448472 -4.312161,0.192448 -49.476156,0.178739 -51.192477,-0.01554 z");
  */

}

.icon-margin-order {

  width:24px;
  height:24px;
}

.black-white-button {
  min-width:72px;
  margin-top:5px;
  border:solid 1px black;
  border-radius:10px;
  background-color: transparent;
  display:inline-block !important;  
}

.black-white-button-active {
  min-width:72px;
  margin-top:5px;
  border:solid 1px black;
  border-radius:10px;
  background-color:#a7cdff;
  box-shadow: 1px 1px 1px 1px lightgrey;
  display:inline-block !important;  
}

.icon-col {
  width:10% !important;
  margin:5px 0px 20px 0px !important;
}
.item-col {
  width:90% !important;
  margin:5px 0px 20px 0px !important;
}
.icon-col-order {
  width:10% !important;
  margin-top:8px !important;
  
}
.item-col-order {
  width:90% !important;
  margin-top:8px !important;
}

.icon-margin, .icon-margin-package {
  width:22px;
  height:22px;
}



.cost-col-1 {
  width: 35%;
  font-size: var(--costs-font-size-desktop);
  font-family: mainfont;

}
.cost-col-2 {
  width: 21%;
  font-size: var(--costs-font-size-desktop);
  font-family: mainfont;
  text-align:center;

}
.cost-col-3 {
  width: 22%;
  font-size: var(--costs-font-size-desktop);
  font-family: mainfont;
  text-align:center;

}
.cost-col-4 {
  width: 22%;
  font-size: var(--costs-font-size-desktop);
  font-family: mainfont;
  text-align:center;
  
}
.costs-header-table {
  width:100%;
  background-color: var(--bg-color-transp);
  border:solid 1px lightgrey;
  border-radius:3px;
  padding-top: 7px;
  padding-bottom: 7px;
  padding-left:15%;
  padding-right:15%;
  position:fixed;
  text-align:center;
  top:64px;
  z-index:5;
}
.costs-header-table-landingpage {
  width:90%;
  background-color: var(--bg-color-transp);
  border-top:solid 1px lightgrey;
  border-left:solid 1px lightgrey;
  border-right:solid 1px lightgrey;
  border-top-left-radius: 25px;
  border-top-right-radius: 25px;
  padding-top: 7px;
  padding-bottom: 7px;
  text-align:center !important;
  top:64px;
  z-index:5;
  padding-left:5%;
  padding-right:5%;
  padding-top:1%

}


.costs-items-table-landingpage {
  width:90%;
  text-align:center;
  padding-top:10px;
  background-color: var(--bg-color-transp);
  border-bottom:solid 1px lightgrey;
  border-left:solid 1px lightgrey;
  border-right:solid 1px lightgrey;
  border-bottom-left-radius: 25px;
  border-bottom-right-radius: 25px;
  padding-left:5%;
  padding-right:5%;
  padding-bottom:5%
}
.costs-header-table-background {
  position:fixed;
  width:100%;
  background-color: white;
  z-index:1;
  top:32px;
  height:172px;
}

.costs-items-row {
  height:75px !important;
  border-bottom:solid 1px rgb(221, 221, 221);
}

.costs-items-table {
  width:100%;
  text-align:center;
  padding-left:15%;
  padding-right:16%;
  margin-top:145px;
}
.order-button-table {
  font-size: var(--costs-font-size-desktop) !important;
  background-color: var(--bg-color-transp);
  border-radius:20px;
  padding: 10px 10px 10px 10px !important;
  box-shadow: 2px 2px 2px 2px rgb(239, 239, 239);
  border: solid 1px lightgrey;
}

.costs-order-image {
  width:28px;
}

.package-image {
  width:50%;
  border-radius:50%;
}

.order-image {
  width: 90%;
}

@media (max-width:400px) {
  #muster-qr1, #muster-qr2, #muster-qr3 {
    max-height:100px !important;
  }
}

@media (max-width:330px) {
  #muster-qr1, #muster-qr2, #muster-qr3 {
    max-height:85px !important;
  }
}



@media (max-width:768px){

  

  .order-image {
    width: 50%;
    
  }

  .orderContainer {
    width:100%;
    min-height:300px;
    position: relative;
    border:solid 1px grey;
    border-radius:30px;
    background-color: var(--bg-color-transp);
    margin:10px 0px;
    padding: 10px 20px 30px 20px;
   
  }
  
  .orderContainer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 70px;
    background-color: rgb(236, 236, 236);
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    border-bottom: solid 1px lightgrey;
    z-index:-1 !important;
  }

  .order-now-button-detail {
    margin-top:10px !important;
    margin-bottom:20px !important;
    width:70%;
    height:35px;
    border:solid 1px rgb(20, 20, 20);
    box-shadow:2px 2px 2px 2px rgb(230, 230, 230);
    border-radius:20px;
    background-color: var(--bg-color-transp);
  }
  .custom-name-qr {
    font-size: clamp(0.625rem, 0.0664rem + 1.5544vw, 0.8125rem);
  }
  
  .order-now-button {
    margin-top:5px !important;
    margin-bottom:0px !important;
    width:80%;
    height:35px;
    border:solid 1px rgb(20, 20, 20);
    box-shadow:2px 2px 2px 2px rgb(230, 230, 230);
    border-radius:20px;
    background-color: var(--bg-color-transp);
  }
  .m1col {
    width:70% !important;
  }
  .m2col {
    width:30% !important;
  }
  
  .package-image {
    width:100%;
    margin-left: -80px !important;
    margin-top: -10px !important;
  }
  .priceContainer {
    min-height:50px;
    margin-top:10px;
    width:100%;
    border:solid 1px lightgray;
    border-radius:10px;
    background-color: var(--bg-color-transp);
    margin:0px 1% 0px 1%;
    
  }
  
  .priceContainer-col {
    margin:10px 0px 0px 0px !important;
    padding:0px 2px 0px 2px !important;

  }
  .costs-header-table-landingpage {
    width:114%;
    margin-left:-7%;
    background-color: var(--bg-color-transp);
    border-top:solid 1px lightgrey;
    border-left:solid 1px lightgrey;
    border-right:solid 1px lightgrey;
    border-top-left-radius: 25px;
    border-top-right-radius: 25px;
    
    text-align:center !important;
    top:64px;
    z-index:5;
    padding-left:3%;
    padding-right:3%;
    padding-top:5%
  }
  .costs-items-table-landingpage {
    width:114%;
    margin-left:-7%;
    text-align:center;
    margin-top:-15px;
    background-color: var(--bg-color-transp);
    border-bottom:solid 1px lightgrey;
    border-left:solid 1px lightgrey;
    border-right:solid 1px lightgrey;
    border-bottom-left-radius: 25px;
    border-bottom-right-radius: 25px;
    padding-left:3%;
    padding-right:3%;
    padding-bottom:1%
  }
  .costs-order-image {
    width:20px;
  }
  .order-button-table {
  
    background-color: var(--bg-color-transp);
    border-radius:15px;
    padding: 5px 5px 5px 5px !important;
    box-shadow: 2px 2px 2px 2px rgb(239, 239, 239);
    border: solid 1px lightgrey;
  }
  .cost-col-1 {
    width: 30%;
    font-size: var(--costs-font-size);
    font-family: mainfont;
   
  }
  .cost-col-2 {
    width: 21%;
    font-size: var(--costs-font-size);
    font-family: mainfont;
    text-align:center;
    
  }
  .cost-col-3 {
    width: 23%;
    font-size: var(--costs-font-size);
    font-family: mainfont;
    text-align:center;
   
  }
  .cost-col-4 {
    width: 26%;
    font-size: var(--costs-font-size);
    font-family: mainfont;
    text-align:center;
    
  }
  .costs-header-table {
    width:100%;
    background-color: var(--bg-color-transp);
    border:solid 1px lightgrey;
    border-radius:3px;
    padding-top: 7px;
    padding-bottom: 7px;
    padding-left:10px;
    padding-right:5px;
    position:fixed;
    top:50px;
    z-index:5;
  }
  .costs-header-table-background {
    position:fixed;
    width:100%;
    background-color: white;
    z-index:1;
    top:42px;
    height:115px;
  }
  
  .costs-items-row {
    height:85px !important;
  }
  
  .costs-items-table {
    width: 100%;
    padding-left:10px;
    padding-right:5px;
    margin-top:90px;
  }
}

.nowrap {
  display:inline-block;
  white-space: nowrap;
}

@media (max-width:574px) {
  .custom-name-qr {
    font-size: clamp(0.4375rem, -0.1484rem + 2.6786vw, 0.8125rem);
  }
}

#image-container {
  position: relative;
  display: inline-block;
}

#product-image-main {
  display: block;
  transition: transform 0.4s ease-in-out, opacity 0.4s ease-in-out;
}

.zoom-out {
  transform: scale(1.02);
  opacity: 0.3;  
}

@media(max-width:767px) {
  #beschriftung {
    /*font-size: clamp(0.3125rem, 0.1136rem + 0.5525vw, 0.5625rem);*/
    /*font-size: clamp(0.375rem, 0.2864rem + 0.443vw, 0.8125rem); /*320/6 - 1900/13*/
    font-size: clamp(0.375rem, 0.2414rem + 0.6682vw, 0.5625rem);
    font-family: "mainfont";
    position: absolute;
    top: 51%; /* Hier die gewünschte y-Position anpassen */
    left: 69%; /* Hier die gewünschte x-Position anpassen */
    transform: translate(-51%, -69%) rotate(-3deg);
    color: white;
    opacity: 0;
    font-weight: bold;
    letter-spacing: 0.1em;
    animation: typing 6s steps(120, end) infinite;
    display: inline-block;
    overflow: hidden;
    white-space: nowrap; 
  }
}

@media(min-width:768px) {
  #beschriftung {
    /*font-size: clamp(0.3125rem, 0.1136rem + 0.5525vw, 0.5625rem);*/
    font-size: clamp(0.375rem, 0.0782rem + 0.6184vw, 0.8125rem);
    /*font-size: clamp(0.375rem, 0.2414rem + 0.6682vw, 0.5625rem);*/
    font-family: "mainfont";
    position: absolute;
    top: 51%; /* Hier die gewünschte y-Position anpassen */
    left: 69%; /* Hier die gewünschte x-Position anpassen */
    transform: translate(-51%, -69%) rotate(-3deg);
    color: white;
    opacity: 0;
    font-weight: bold;
    letter-spacing: 0.1em;
    animation: typing 6s steps(120, end) infinite;
    display: inline-block;
    overflow: hidden;
    white-space: nowrap; 
  }
}


@media (max-width:575px) {
  #beschriftung {
    font-size: clamp(0.3125rem, -0.0012rem + 1.5686vw, 0.5625rem);
  }
  #mobile-on {
    display: inline-block !important;
  }
}

@keyframes typing {
  0% { width: 0; opacity: 1; }
  20% { width: 20ch; opacity: 1; } /* Halte den Text vollständig sichtbar */
  80% { opacity: 1; }
  90% { opacity: 0; } /* Fade-Out Effekt */
  100% { opacity: 0; width: 20ch; } /* Text bleibt unsichtbar, während die Breite gehalten wird */
}

@keyframes typing-fade {
  0%, 100% { opacity: 0; }
  10%, 70% { opacity: 1; } /* Text ist sichtbar und wird "getippt" */
  80%, 90% { opacity: 0; } /* Fade-Out Effekt und kurze Pause */
}



.text-icon-costs {
  margin-left:30px !important;
  line-height:1;
}

.package-row {
  padding:0px 5% 0px 5% !important;
  margin-top:15px !important;
  margin-bottom:15px !important;
  height: 120px !important;
}

.package-col {
  padding-left:25px !important;
  padding-right:25px !important;
  line-height:1.2 !important;
  
}

@media (max-width:768px){
  
  .package-row {
    padding:0px 3% 0px 3% !important;
    margin-top:10px !important;
    margin-bottom:0px !important;
    height: 95px !important;
  }
  
  .package-col {
    padding-left:25px !important;
    padding-right:25px !important;
    line-height:1.2 !important;
    margin-bottom: 10px !important;
  }
  .icon-margin {
    margin-left:-2px;
    width:22px;
    height:22px;
  }
  .icon-margin-package {
    margin-left:10px;
    width:22px;
    height:22px;
  }
  .text-icon-costs {
    margin-left:15px !important;
    line-height:1;
  }
  .icon-col {
    width:10% !important;
    margin:2px 0px 10px 0px !important;
  }
  .item-col {
    width:90% !important;
    margin:2px 0px 10px 0px !important;
  }
}

.text-icon-costs-order {
  margin-left:0px !important;
  line-height:1;
}

.vertical-space.one {
  padding-top:95px;
}


.vertical-space.two {
  padding-top:190px;
  margin-top:-15px;
}

.vertical-space.two2 {
  padding-top:150px;
}

.vertical-space.three {
  padding-top:100px;
}


.font_text_memorio {
  font-family: mainfont;
  line-height: 0.95;
  color: var(--bg-color);
  font-size:66px;

}
.font_text_home_main{
  font-family: mainfont;
  line-height: 1.2 !important;
  color: var(--bg-color);
  font-size:26px;
}

.font_text_home_expl{
  font-family: mainfont;
  color: var(--bg-color);
  line-height: 1.2 !important;
  font-size:26px;
  line-height:1;
}




#home-first-text{
  position: relative;


}

#home-distance-one {  
  height: clamp(3.75rem, 2.8125rem + 3.75vh, 7.5rem);
}

#home-distance-two {  
  
  height: clamp(1.5625rem, -2.34375rem + 15.625vh, 17.1875rem);
}

#home-caption {
  /*font-size:45px;*/
  line-height:1.1;
  color: white !important;
  font-family: 'Pristina';
 
  /*font-size: 1.625rem;*/

  font-size: clamp(1.25rem, 0.21875rem + 4.125vh, 5.375rem);

}

#home-second-text {
  line-height:1.2;
  font-size: clamp(0.9375rem, 0.1458333333333333rem + 1.4583333333333333vw, 1.575rem);
  color: white !important; 
  /*font-size: clamp(0.875rem, 0.390625rem + 1.9375vh, 2.8125rem);*/
}

#home-text-learn-more {
  color: white !important;
  
  font-size: clamp(0.8rem, 0.686rem + 0.457vw, 1.2rem)
}

#header-logo-home {
 
  
  height: clamp(3.125rem, 0.46875rem + 10.625vh, 13.75rem);
 
}


p {
  font-family: mainfont;
  margin: 0;
  padding: 0;
}

label {
  font-family: mainfont;
  font-size:13px;
}

input:focus {
  box-shadow: none;
  border-color: rgba(0,0,0,.125) !important;
  outline: none;
}

#biography-content p, #nachruf-content p, #dates-content-header p {
  margin: 0;
  padding: 0;
}

.font_text_globalglobalheader_vorschau {
  font-size: 26px;
  margin: 0;
  padding: 0;
 
}
.font_text_globalheader_vorschau {
  font-size: 22px;
  margin: 0;
  padding: 0;
 
}
.font_text_header_vorschau{
  font-size:17px;
  margin: 0;
  padding: 0;
  
}
.font_text_regular_vorschau{
  font-size: 15px;
  margin: 0;
  padding: 0;
  
}
.font_text_footer_vorschau{
  font-size: 13px;   
  margin: 0;
  padding: 0;

}



h1 {
  min-height: 0vw;
  font-family: mainfont;
  font-size: clamp(1.375rem, 1.15625rem + 1.09375vw, 2.25rem) !important;
  
  padding: 0;
  font-weight: 600 !important;
  /*font-size: 26px; 46*/
}
.font_text_globalglobalheader_person {
  min-height: 0vw;
  font-family: mainfont;
  font-size: clamp(1.625rem, 1.3125rem + 1.5625vw, 2.875rem);
  margin: 0;
  padding: 0;
  /*font-size: 26px; 46*/
}
.font_text_globalheader_person {
  min-height: 0vw;
  font-family: mainfont;
  font-size: clamp(1.375rem, 1.15625rem + 1.09375vw, 2.25rem);
  margin: 0;
  padding: 0;
  /*font-size: 22px; 36*/
}
.font_text_header_person {
  min-height: 0vw;
  font-family: mainfont;
  font-size: clamp(1.063rem, 0.95375rem + 0.54625vw, 1.5rem);
  margin: 0;
  padding: 0;
  /*font-size:17px; 24*/
}
.font_text_regular_person {
  min-height: 0vw;
  font-family: mainfont;
  font-size: clamp(0.938rem, 0.86rem + 0.39vw, 1.25rem);
  margin: 0;
  padding: 0;
  /*font-size: 15px;  20*/
}
.font_text_footer_person {
  min-height: 0vw;
  font-family: mainfont;
  font-size: clamp(0.813rem, 0.76625rem + 0.23375vw, 1rem);
  
  margin: 0;
  padding: 0;
  font-weight:400;
  /*font-size: 13px;  16*/
}

ib {
  display: inline-block;
}

.font_text_footerfooter_person {
  min-height: 0vw;
  font-family: mainfont;
  /*font-size: clamp(0.613rem, 0.76625rem + 0.23375vw, 0.8rem);*/
  font-size: clamp(0.65625rem, 0.6125rem + 0.2188vw, 0.875rem);
  margin: 0;
  padding: 0;
  font-weight:400;
  
  
  /*font-size: 13px;  16*/
}

.font_text_minorfooter_person {
  min-height: 0vw;
  font-family: mainfont;
  font-size: clamp(0.4rem, 0.3rem + 0.5000000000000001vw, 0.8rem);
  margin: 0;
  padding: 0;
  /*font-size: 6px;  12*/
}


#example-video, #example-pic {
  height: 65vh;
  padding-bottom: 5vh;
}



#konzept-text-1 {
  margin-left:60px;
  text-align: justify;
}

#konzept-text-2 {  
  text-align: justify;
}

.row.examples {
  height: 60vh;  
  justify-content:center;
  align-content:center;
}

#konzept-pic-1 {
  height: 40vh;
  margin-left:60px;
}
#konzept-pic-2 {
  height: 19.5vh;
}
#konzept-pic-3 {
  height: 19.5vh;
  margin-top: 1vh;
}

#konzept-pic-4 {
  height: 40vh;
  margin-right:60px;
}
#example-video {
  height: 62vh;
}



.icon #tooltip-qrnameInput {
  position: absolute;
  right: -120px;
  top: 470px;
  background: #fff;
  padding: 10px 18px;
  border-radius: 25px;
  box-shadow: 20px 20px 20px rgba(0,0,0,0.1);
  opacity: 0;
  width:250px;
  pointer-events:none;
  border:solid 1px grey;
}

.icon:hover #tooltip-qrnameInput {
  opacity: 1;
  pointer-events: auto;
}

.icon #tooltip-qrnameInput:before{
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  background: #fff;
  top: 30%;
  left: -1px;
  transform: translateX(-50%) rotate(45deg);
  border-left:solid 1px grey;
  border-bottom:solid 1px grey;
}


.icon #tooltip-qrname {
  position: absolute;
  right: 75px;
  top: 580px;
  background: #fff;
  padding: 10px 18px;
  border-radius: 25px;
  box-shadow: 20px 20px 20px rgba(0,0,0,0.1);
  opacity: 0;
  width:220px;
  pointer-events:none;
  border:solid 1px grey;
}

.icon:hover #tooltip-qrname {
  opacity: 1;
  pointer-events: auto;
}

.icon #tooltip-qrname:before{
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  background: #fff;
  top: 30%;
  left: -1px;
  transform: translateX(-50%) rotate(45deg);
  border-left:solid 1px grey;
  border-bottom:solid 1px grey;
}



.icon #tooltip-dates {
  position: absolute;
  right: -420px;
  top: -46px;
  background: #fff;
  padding: 10px 18px;
  border-radius: 15px;
  box-shadow: 20px 20px 20px rgba(0,0,0,0.1);
  opacity: 0;
  width:400px;
  pointer-events:none;
  border:solid 1px grey;
}

.icon:hover #tooltip-dates {
  opacity: 1;
  pointer-events: auto;
}

.icon #tooltip-dates:before{
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  background: #fff;
  top: 30%;
  left: -0.5px;
  transform: translateX(-50%) rotate(45deg);
  border-left:solid 1px grey;
  border-bottom:solid 1px grey;
}

.price-row-container-new-id-authenticated-user {
  z-index:2;
  position:fixed;
  left:45%;
  top:110px;
  height:80px;
  width:10%;
  min-width: 100px;
  background-color:var(--bg-color);
  border-bottom-left-radius:18px;
  border-bottom-right-radius:18px;
  border-bottom:solid 1px lightgrey;
  border-left:solid 1px lightgrey;
  border-right:solid 1px lightgrey;
  box-shadow: 15px 15px 15px 15px rgba(0,0,0,0.05);
}

.icon #tooltip-rubrik {
  position: absolute;
  right: -620px;
  top: -8px;
  background: #fff;
  padding: 10px 18px;
  border-radius: 15px;
  border:solid 1px grey;
  box-shadow: 20px 20px 20px rgba(0,0,0,0.1);
  opacity: 0;
  width:600px;
  pointer-events:none;
}

.icon:hover #tooltip-rubrik {
  opacity: 1;
  pointer-events: auto;
}

.icon #tooltip-rubrik:before{
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  background: #fff;
  top: 11%;
  left: -1px;
  transform: translateX(-50%) rotate(45deg);
  border-left:solid 1px grey;
  border-bottom:solid 1px grey;
}



.icon #tooltip-password {
  position: absolute;
  right: -420px;
  top: -30px;
  background: #fff;
  padding: 10px 18px;
  border-radius: 25px;
  border:solid 1px grey;
  box-shadow: 20px 20px 20px rgba(0,0,0,0.1);
  opacity: 0;
  width:400px;
  pointer-events:none;
}

.icon:hover #tooltip-password {
  opacity: 1;
  pointer-events: auto;
}

.icon #tooltip-password:before{
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  background: #fff;
  top: 30%;
  left: -1px;
  transform: translateX(-50%) rotate(45deg);
  border-left:solid 1px grey;
  border-bottom:solid 1px grey;
}

.icon #tooltip-headerpicture {
  position: absolute;
  right: 208px;
  top: 400px;
  background: #fff;
  padding: 10px 18px;
  border-radius: 25px;
  border:solid 1px grey;
  box-shadow: 20px 20px 20px rgba(0,0,0,0.1);
  opacity: 0;
  width:280px;
  pointer-events:none;
}

.icon:hover #tooltip-headerpicture {
  opacity: 1;
  pointer-events: auto;
}

.icon #tooltip-headerpicture:before{
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  background: #fff;
  top: 30%;
  left: -1px;
  transform: translateX(-50%) rotate(45deg);
  border-left:solid 1px grey;
  border-bottom:solid 1px grey;
}

.icon #tooltip-inputform {
  position: absolute;
  right: -113px;
  top: 35px;
  background: #fff;
  padding: 10px 18px;
  border-radius: 25px;
  box-shadow: 20px 20px 20px rgba(0,0,0,0.1);
  opacity: 0;
  width:400px;
  pointer-events:none;
  border:solid 1px grey;
}

.icon:hover #tooltip-inputform {
  opacity: 1;
  pointer-events: auto;
}

.icon #tooltip-inputform:before{
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  background: #fff;
  top: 30%;
  left: 1px;
  transform: translateX(-50%) rotate(50deg);
  border-left:solid 1px grey;
  border-bottom:solid 1px grey;
}

.form-control {
  margin-bottom:10px;
}


#arrow-home {
  width:30px;
}

.card.card-homemain {
  width: 110%;
  max-width: 1200px;
}

.card.card-signin {
  width: 100%;
  max-width: 1500px;

}

.card.card-order-message {
  width: 100%;
  max-width: 1000px;
  

}

.card.card-order {
  width: 100%;
  max-width: 1800px;
  padding-right:5% !important;
  padding-left:5% !important;
}

@media(max-width:768px) {
  .card.card-order {
    width: 100%;
    max-width: 1600px;
    padding-right:0% !important;
    padding-left:0% !important;
  }
}

.card.card-b2b {
  width: 100%;
  max-width: 550px;
}

.card.card-b2b-header {
  width: 100%;
  max-width: 1200px;
}

.card.card-b2b-subheader {
  width: 100%;
  max-width: 800px;
}

.card.card-homeexplain {
  width: 100%;
  max-width: 4000px;
}

.card.card-homeexplainTwo {
  width: 100%;
  max-width: 4000px;
}

.card.card-formular {
  width: 100%;
  max-width: 800px;
}
.card.card-formular-vorschau {
  width: 100%;
  max-width: 350px;
}
.card.card-qrcode {
  width: 100%;
  max-width: 1800px;
}
.card.card-stats {
  width: 100%;
  max-width: 500px;
}

.card.card-person-home {
  width: 100%;
  max-width: 1200px;
}
.card.card-person-location {
  width: 100%;
  max-width: 1100px;
}
.card.card-person-header {
  width: 100%;
  max-width: 1400px;
}
.card.card-person-condolence {
  width: 100%;
  max-width: 1800px;
}
.card.card-book-page-one {
  width: 100%;
  max-width: 800px;
}


.col.formular {
  width:50%;
}


.card.card-costs {
  width: 100%;
  max-width: 1400px;
  margin:auto;
}
.card.card-personal {
  width: 100%;
  max-width: 1000px;
  margin:auto;
}
.card.card-impressum {
  width: 100%;
  max-width: 600px;
  margin:auto;
}
.card.card-faq {
  width: 100%;
  max-width: 950px;
  margin:auto;
}

.col.costs.text {
  width:60%;
  padding-right:40px;
  
}
.col.costs.cost {
  width:40%;
}
.col.costs.explain {
  width:100%;
}

.smartphone-body {
  background: url('backgrounds/smartphone.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    height:730px;
}

.smartphone-body-vorschau {
  background: url('backgrounds/smartphone.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    
}

.condolenceBook-body {
  background: url('backgrounds/condolenceBook.png');
  background-position-x: center;
  background-repeat: no-repeat;
  height: 500vh;
  overflow-y: hidden;
  scrollbar-width: none;
}

.condolenceBook-body::-webkit-scrollbar {
  display: none;
}
.condolenceBook-body::-webkit-scrollbar-thumb {
  display: none;
}
.condolenceBook-body::-webkit-scrollbar-track {
  display: none;
}

.condolenceBook-body-vorschau {
  background: url('backgrounds/condolenceBook.png');
  background-position-x: center;
  background-repeat: no-repeat;
  height: 820px;
  width: 482px;
  overflow-y: hidden;
  transform: scale(0.67);
  transform-origin: 20px 0;
  scrollbar-width: none;
}
.condolenceBook-body-vorschau::-webkit-scrollbar {
  display: none;
}

.condolenceBook-body-vorschau::-webkit-scrollbar-thumb {
  display: none;
}
.condolenceBook-body-vorschau::-webkit-scrollbar-track {
  display: none;
}

.condolenceBook-body-vorschau-home {
  background: url('backgrounds/condolenceBook.png');
  background-position-x: 23%;
  background-repeat: no-repeat;
  height: 800px !important;
  width: 482px;
  overflow-y: hidden;
  transform: scale(0.8);
  transform-origin: 20px 0;
  scrollbar-width: none;
  margin-bottom:-180px;
}
.condolenceBook-body-vorschau-home::-webkit-scrollbar {
  display: none;
}

.condolenceBook-body-vorschau-home::-webkit-scrollbar-thumb {
  display: none;
}
.condolenceBook-body-vorschau-home::-webkit-scrollbar-track {
  display: none;
}

@keyframes MOVE-RIGHT {
  0% { background-position-x: 35%; }
  100% { background-position-x: 110% }
}

@keyframes MOVE-LEFT {
  0% { background-position-x: 110%; }
  100% { background-position-x: 35% }
}

@keyframes NEXTPAGE-LEFT {
  0% { background-position-x: 110%;background-position-y: 0%; }
  50% { background-position-x: 280%;background-position-y: 0%; }
  52% { background-position-y: 500%; }
  51% { background-position-x: -180%; }
  53% { background-position-y: 0%; }
  100% { background-position-x: 35% }
}

@keyframes NEXTPAGE-RIGHT {
  0% { background-position-x: 35%;background-position-y: 0%; }
  50% { background-position-x: -180%;background-position-y: 0%; }
  52% { background-position-y: 500%; }
  51% { background-position-x: 280%; }
  53% { background-position-y: 0%; }
  100% { background-position-x: 110% }
}

@keyframes MOVE-RIGHT-VORSCHAU {
  0% { background-position-x: 23%; }
  100% { background-position-x: 77% }
}

@keyframes MOVE-LEFT-VORSCHAU {
  0% { background-position-x: 77%; }
  100% { background-position-x: 23% }
}

@keyframes NEXTPAGE-LEFT-VORSCHAU {
  0% { background-position-x: 77%;background-position-y: 0%; }
  50% { background-position-x: 180%;background-position-y: 0%; }
  51% { background-position-y: 500%; }
  52% { background-position-x: -80%; }
  53% { background-position-y: 0%; }
  100% { background-position-x: 23% }
}

@keyframes NEXTPAGE-RIGHT-VORSCHAU {
  0% { background-position-x: 23%;background-position-y: 0%; }
  50% { background-position-x: -80%;background-position-y: 0%; }
  51% { background-position-y: 500%; }
  52% { background-position-x: 180%; }
  53% { background-position-y: 0%; }
  100% { background-position-x: 77% }
}

/*#condolence-content-header {
  zoom: 0.67;
  transform: scale(0.67);
  transform-origin: 0 0;
}*/

#condolenceCol {
  /*zoom: 1.1;*/
  transform: scale(1.1);
  transform-origin: 50% 0;
}

.font_text_condolence_header {
  
  color:rgb(150,150,150);
  font-size:16px;
  
}

.font_text_condolence_message p {
  font-family: "bradley";
  font-size:23px;
  font-weight: 800;
}

.font_text_condolence_message_show {
  font-family: "bradley";
  font-size:23px;
  font-weight: 800;
  line-height:1.2;
  display: inline-block;
  white-space: nowrap;
  margin-left:-15px;
}

.font_text_condolence_message_vorschau p {
  font-family: "bradley";
  font-size:clamp(0.938rem, 0.86rem + 0.39vw, 1.25rem);
  font-weight: 800;
}




#header-container-personpage-vorschau {
  height:32px;
  background-color: var(--bg-color);
  padding:0;
  margin:0;
  width:320px;
  margin-bottom:-2px;

  
}
#header-container-row-personpage-vorschau {
  height: inherit;
  text-align: center;
  width:320px;
 
    
}

.col.homemain.one {
  width:10%;
}
.col.homemain.two {
  width:80%;
}
.col.homemain.three {
  width:10%;
}
.col.homemain.explain.one {
  width:25%;
}
.col.homemain.explain.two {
  width:50%;
}
.col.homemain.explain.three {
  width:25%;
}

.nav-link {
  position: relative;
  font-family: mainfont;
  color: black !important;
  margin-left: 7px;
  margin-right: 7px;
  font-size: clamp(1.125rem, 0.939rem + 0.3876vw, 1.375rem);
 
  line-height:0.7 !important;
}

.nav-link:after {
  content: "";
  position: absolute;
  background-color: var(--underline-color, black) !important;
  height: 2px;
  width: 0;
  left: 0;
  top: 29px;
  transition: 0.3s;
}

.nav-link:hover:after {
  width:100%;
}

.nav-link.selected:after {
  background-color: var(--underline-color, black) !important;
  height: 2px;
  width:100%; 
  color: black !important;
}

.nav-link.selected {
  position: relative;
  font-family: mainfont;
  font-size: clamp(1.125rem, 0.939rem + 0.3876vw, 1.375rem);
  color: var(--underline-color, black) !important;
 
}

.nav-link.person {
  min-height: 0vw;
  position: relative;
  font-family: mainfont;
  font-size: clamp(0.7rem, 0.01574468085106362rem + 1.4255319148936174vw, 1.37rem);
  color: rgba(0,0,0,1) !important;
  margin-top: clamp(6.95rem, 8.567021276595744rem + -1.7021276595744679vw, 7.75rem);
  padding: 0;  

}

.nav-link.person:after {
  min-height: 0vw;
  content: "";
  position: absolute;
  background-color: black;
  height: 1px;
  width: 0;
  left: 0;
  bottom: clamp(0.188rem, -0.0029787234042553123rem + 0.39787234042553193vw, 0.375rem);
  transition: 0.3s;
}

.nav-link.person:hover:after {
  width:100%;
}

.nav-link.person.selected:after {
  min-height: 0vw;
  background-color: black;
  height: 1px;
  width:100%; 
  color: black !important;
}

.nav-link.person.selected {
  min-height: 0vw;
  position: relative;
  font-family: mainfont;
  /*font-size: 18px;*/
  /*margin-top: 100px;*/
  font-size: clamp(0.7rem, 0.01574468085106362rem + 1.4255319148936174vw, 1.37rem);
  color: black !important;
  margin-top: clamp(6.95rem, 8.567021276595744rem + -1.7021276595744679vw, 7.75rem);
}

.nav-link.vorschau {
  position: relative;
  font-family: mainfont;
  font-size: 17px;

  color: rgba(0,0,0,1) !important;
  padding: 0;
}
.nav-link.vorschau:after {
  content: "";
  position: absolute;
  background-color: black;
  height: 1px;
  width: 0;
  left: 0;
  bottom: 4px;
  transition: 0.3s;
}
.nav-link.vorschau:hover:after {
  width:100%;
}

.nav-link.vorschau.selected:after {
  background-color: black;
  height: 1px;
  width:100%; 
}
.nav-link.vorschau.selected {
  font-size: 17px;

  color: black !important;
}

.vertical-space-for-header {
  height:80px;
  background-color: transparent !important;
}

.vertical-space-for-header-two {
  padding-top:80px;
}

#header-logo {
  height: 70px;
  margin-top: 5px;
}

#header-logo-grave {
  height: 120px;
  margin-top: -20px;
}

#header-logo-column {
  text-align: center;
}
#header-container {
  height:80px;  
  background-color: var(--bg-color);
  border-bottom:solid 1px lightgray;
}
#header-container-row {
  height:80px;  
  background-color: var(--bg-color);
}


#header-container-vorschau {
  height:50px;
  background-color: var(--bg-color);
  margin-left: 17px !important;
  width: 323px !important;
  top: 80px !important;
}

#offcanvasNavbarVorschau {
  margin-top:600px;
  margin-bottom:65px;  
  margin-left:1px;  
  z-index:1000;
  overflow-x: hidden;
  position:fixed;
  height:586px;
  transition: 0.4s;
  width:0;
  background:rgba(255, 247, 241, 1);
}

.pay-accordion {
  margin-top:20px;
  margin-bottom:65px;  
  margin-left:1px;  
  height:45px;
  width:inherit;
  background:rgba(255, 247, 241, 0.65);
  border:solid 1px lightgrey;
 
}

.explain-payment {
  margin-top:-66px;
  margin-bottom:65px;
  margin-left:1px;  
  height:67px;
  width:inherit;
  background:white;
  border:solid 1px lightgrey;
}


/*QRCODE PAGE*/
.col.qrcode.image.one {
  text-align: right;
  width: 50%;
  margin-bottom:15px;
}
.col.qrcode.caption.one {
  text-align: center;
  width: 100%;
}
.col.qrcode.caption.two {
  text-align: center;
  width: 100%;
  margin-top:30px;
}
.col.qrcode.text.one {
  text-align: left;
  width: 50%;
}
.col.qrcode.image img {
  width: 100%;
}
.col.qrcode.text.one p {
  width: 100%;
  font-size: clamp(0.938rem, 0.86rem + 0.39vw, 1.25rem);
  font-family: mainfont;
  line-height: 1;
}

.col.map.space {
  width: 15%;
  margin-top:10px;
}

.col.map {
  text-align: right;
  width: 50%;
  margin-top:10px;
 
}
.col.map.search {
  text-align: left;
  width: 45%;
  margin-top:10px;
 
}

#vorschau-button {
  display:none;
}

big {
  font-weight:600;
}

#vorschau-col {
  display:block;
}



.visible {
  opacity: 1 !important;
}



@media (max-width:768px){

  .product-preview-thumbnail {
    width:70px !important;;
  }
  
  .product-preview-thumbnail-selected {
    width:70px !important;
  }

  .vertical-space.two {
    padding-top:280px;
    margin-top:0px;
  }

  h1 {
    min-height: 0vw;
    font-family: mainfont;
    font-size: clamp(1.375rem, 1.15625rem + 1.09375vw, 2.25rem);
    margin: 40px 0px 20px 0px !important;
    padding: 0;
    font-weight: 600 !important;
    /*font-size: 26px; 46*/
  }
  

  .col.formular {
    width:100%;
  }

  #vorschau-col {
    display:block;
    /*zoom: 0.75;*/
  }
  .smartphone-body-vorschau {
      background: url('backgrounds/smartphone.png');
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center;
      height:730px;
      width:358px;
      transform: scale(0.7);
      transform-origin: 25% 0;
      
  }
  #vorschau-button {
    display:block;
  }

  .col.homemain.one {
    width:5%;
  }
  .col.homemain.two {
    width:90%;
  }
  .col.homemain.three {
    width:5%;
  }
  .col.homemain.explain.one {
    width:2%;
  }
  .col.homemain.explain.two {
    width:96%;
  }
  .col.homemain.explain.three {
    width:2%;
  }
  .col.qrcode.caption.two {
    text-align: center;
    width: 100%;
    margin-top:0px;
  }
  .col.costs.text {
    width:60%;
    padding-right:10px;
    
  }
  
  

}


.accordion-item.input {
  border:none !important;
  border-radius:17px !important;
  margin-top:10px !important;
  margin-bottom:10px !important;
}

.accordion-header.shadow.input {
  border-radius:17px !important;
}

button.accordion-button.input  {
  
  background: var(--bg-color);
  padding: 25px 20px 25px 10px !important;
  margin: 0 !important;
  border-radius: 17px !important;
  border: solid 1px lightgrey;
}


/*EXAMPLE PAGE*/
.accordion-button img {
  height:30px;
  width:30px;
}
.accordion-button {
  height: 50px;
  outline: none;
  border: none;  
}

button.accordion-button.faq  {
  height: 55px;
  background: var(--bg-color);
  padding: 30px 20px 30px 20px !important;
  margin: 0 !important;
  border-radius: 17px !important;
  border: solid 1px lightgrey;
}

.accordion-item.faq {
  border:none;
  border-radius:17px;
  margin-top:10px;
  margin-bottom:10px;
}

.accordion-caption.faq p {
  padding-bottom:15px;
  padding-right:20px;
  color:black !important;
}

.accordion-header.shadow.faq {
  border-radius:17px !important;
}

div.accordion-item.faq {
  border-radius:15px !important;
}

@media (max-width:620px) {
  button.accordion-button.faq  {
    height:55px;
    background: var(--bg-color);
  }
}

@media (max-width:450px) {
  button.accordion-button.faq  {
    height: 55px;
    background: var(--bg-color);
  }
}

@media (max-width:400px) {
  button.accordion-button.faq  {
    height: 70px;
    background: var(--bg-color);
  }
}

@media (max-width:340px) {
  button.accordion-button.faq  {
    height: 85px;
    background: var(--bg-color);
  }
}



button.accordion-button.b2b  {
  height: 50px;
  background: var(--bg-color);
}



#accordion-button-dates:focus, #accordion-button-pictures:focus, #accordion-button-biography:focus, #accordion-button-condolence:focus,
#accordion-button-nachruf:focus, #accordion-button-own1:focus, #accordion-button-password:focus, #accordion-button-font:focus,
#accordion-button-selection:focus, button.accordion-button:focus {
  box-shadow: none;
  border-color: rgba(0,0,0,.125);
  color: black !important; 
}

.accordion-caption {
  position: relative;
  top: 8px;
}
.container_gallery{
  column-count: 3;
  width: 100%;
}
.container_gallery_music{
  column-count: 1;
  width: 100%;
}
.container_gallery_vorschau{
  column-count: 2;
  width: 100%;
  margin-top:-10px;
}
.grid-item img {
  width: 100%;
  height: auto;
  margin-top: 10px;
  border-radius:10px;
}

.grid-item-video img {
  width: 100%;
  height: auto;
  margin-top: 10px;
  border-radius:10px;
  -webkit-filter: brightness(0.8);
  filter: brightness(0.8);
}

.grid-item-video {
  position: relative;
  cursor: pointer;
}

.grid-item-vorschau-video { 
  position: relative;
}

.grid-item-vorschau img, .grid-item-vorschau iframe {
  width: 100%;
  height: auto;
  margin-top: 10px;
  border-radius:10px;
}

.image-section-vorschau {
  margin-top: 10px;
  margin-bottom:-10px;
  display:block !important;

}



.grid-item-vorschau-video img {
  width: 100%;
  height: auto;
  margin-top: 10px;
  border-radius:10px;
  -webkit-filter: brightness(0.5);
  filter: brightness(0.5);
} 

.grid-item-play-button-home {
  position:absolute;
  border-bottom: solid 30px transparent;
  border-top: solid 30px transparent;
  border-left: solid 40px white;
  top:40px; 
  left:40%;
  -webkit-filter: brightness(1) !important;
  filter: brightness(1) !important;
  opacity:0.8;
}


.grid-item-play-button {
  position:absolute;
  border-bottom: solid 30px transparent;
  border-top: solid 30px transparent;
  border-left: solid 40px white;
  /*top:60px;*/
  
  top: 50%;
  transform: translateY(-55%);
  left:40%;
  -webkit-filter: brightness(1) !important;
  filter: brightness(1) !important;
  opacity:0.8;
}

.grid-item-play-button-vorschau {
  position:absolute;
  border-bottom: solid 30px transparent;
  border-top: solid 30px transparent;
  border-left: solid 40px white;
  top: 50%;
  transform: translateY(-55%);
  left:40%;
  -webkit-filter: brightness(1) !important;
  filter: brightness(1) !important;
  opacity:0.8;
 
}

.scrollfade {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.scrollfade.visible {
  opacity: 1;
  transform: translateY(0);
}

@media (min-width:769px) {
  .svg-width {
    width: 120px;
  } 
  .svg-caption {
    display:flex;
    min-height:70px;
    align-items: center;
    justify-content: center;
  }
  .svg-description {
    display:flex;
    min-height:120px !important;
    justify-content: center;
  }
}

@media (max-width:768px) {
  .svg-width {
    width: 100px;
  } 
}

.action-price {
  text-decoration:line-through;
  text-decoration-thickness:2px;
  text-decoration-color:red;
  opacity:0.5;
  display: none;
}

.action-price-text {
  display:none;
}

.whatsapp-chat {
  position: fixed;
  bottom: 9%;
  right: 5%;
  z-index:9999;
}

.scroll-order {
  position: fixed;
  
  width:100%;
  background-color: var(--bg-color);
  bottom: 0%;
  border-top:solid 1px black;
  
  z-index:2;
  height:50px;
  color:black;
  text-decoration: none;
    
}

.btn-memorio-new {
  border:solid 1px black;
  background:transparent;
  padding: 5px 15px 5px 15px;
  border-radius:12px;
  box-shadow: 2px 2px 2px 2px lightgray;
  width:auto;
}



 
#formular-left {
  background-color: #fff;
}

.row.vorschau {
  width:324px;
  height:593px;    
  overflow:hidden;
  overflow-y:scroll;
  -ms-overflow-style: none;  
  scrollbar-width: none;
  margin-top:0px;
  
  
 
}
.row.vorschau::-webkit-scrollbar {
  width:5px;
  padding-left: 50px;
  display: none;
}

.row.vorschau::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.541);
  border-radius: 10px;
  display: none;
}
.row.vorschau::-webkit-scrollbar-track {
  background-color: rgb(158, 158, 158, 0.3);
  border-radius: 10px;
  display: none;
}

.row.date.vorschau2 {
  min-height:490px;
}

.slideout-overlay {
  background-color: rgba(215, 219, 221, 0.5);
  }

.btn-memorio {
  background:transparent !important;
  color:black !important;
  border:solid 1px rgba(207, 207, 207, 0.8) !important;
}

.btn-memorio-pay {
  background:rgb(94, 169, 255) !important;
  color:black !important;
  border:solid 1px rgba(207, 207, 207, 0.8) !important;
}


/*Personpage*/
#header-container-personpage {
  height:65px;
  background-color: var(--bg-color);
}
#header-container-row-personpage {
  height: inherit;
  text-align: center;
}
.col.header.personpage {
  margin-top: -80px;    
  height: 124px;
}  
.col.header.personpage.vorschau {
  margin-top: -100px;    
  height: 124px;
}  
.header_profile_picture img {
  width: 75%;
  margin-top:10px;
  border-radius: 30px;
}

.header_profile_picture_vorschau img {
  width: 68%;
  margin-top:10px;
  border-radius: 10px;
}

.font_text_caption{
  font-family: mainfont;
  font-size: 40px;
  line-height: 0.85;
  color: black;
}

#pay-submit-button {
  display: inline-block;
  background-color: var(--bg-color-transp) !important;
  border: none;
  height: 45px;
  border-radius: 25px;
  text-align: center;
  text-decoration: none;
  color: black;
  width: 100% !important;
  font-family: Arial, sans-serif;
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
  border: solid 1px black !important;
  transition: background-color 0.3s ease, color 0.3s ease;
  
}

#pay-submit-button:hover {
  background-color: var(--hover-button-color) !important;
  color: var(--bg-color) !important;
  border:solid 1px var(--bg-color) !important;
}




.paypal-button {
  display: inline-block;
  background-color: #ffc439; /* PayPal yellow */
  border: none;
  padding: 10px 20px;
  border-radius: 25px;
  text-align: center;
  text-decoration: none;
  color: black;
  width: 100%;
  
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.2);
}

.paypal-button img {
  height: 20px;
  vertical-align: middle;
}

.top-caption {
  top: 85%;
  bottom: auto;
  transform: translateY(-85%);
}

.container-post-one {
  position:relative;
  margin-right:20px;
  background-color: var(--bg-color);
  width: 100%;
}

.container-post-two {
  position:relative;
  margin-right:20px;
  background-color: var(--bg-color-two);
  width: 100%;
}

.col.person {
  width:100%;
  padding:0;
  margin:0;
} 
.col.person.vorschau {
  width: 50%;
} 

#submenu-container-staff {
  background-color:rgba(250, 240, 232, 0.98);
  height:55px;
  width:100%;
  margin-bottom:10px;
  margin-top:0px;
  position:fixed;
  top:65px;
  z-index:10;
}

#submenu-row-staff {
  margin-top:2px;
}

#submenu-container-person {
  background-color:rgba(250, 240, 232, 0.98);
  height:120px !important;
  width:100%;
  padding-top:80px !important;
}

@media (max-width:1200px) {
  
  .home-padding {
    padding:0px 1px;
  }
  
}  

@media (max-width:1000px){
  
  

  col.map.space {
    width: 0%;
    margin-top:10px;
  }
  
  .col.map {
    text-align: right;
    width: 100%;
    margin-top:0px;
  }
  .col.map.search {
    text-align: center;
    width: 100%;
    margin-top:10px;   
    margin-left:0px;
  }
  

}

  @media (max-width:768px){

    .caption-container {
      background: var(--bg-color);
      height: 45px;
      margin-right:-11px !important;
      margin-left:-11px !important;
      border-top: solid 0.5px rgba(0, 0, 0, 0.2);
      border-bottom: solid 0.5px rgba(0, 0, 0, 0.2);
    }

   

    #submenu-container-staff {
      margin-top:-20px;
      height:42px;
     
    }

    #submenu-row-staff {
      margin-top:-7px;
    }
    
    
    .col.person {
      width:50%;
    } 
    .col.qrcode.image.one {
      text-align: center;
      width: 100%;
    }
    .col.qrcode.image.one img {
      width: 100%;
      margin-right:0px;
      
    }
    .col.qrcode.text.one {
      text-align: left;
      width: 100%;
    }
    .col.qrcode.text.one p {
      width: 100%;
    } 
    .nav-link {
      font-size: 18px;
      margin-top:50px;
      margin-left: 0px !important;
      color: black !important;
      line-height:1.2 !important;
    }
    .nav-link:after {
      content: "";
      position: absolute;
      background-color: black;
      height: 1px;
      width: 0;
      left: 0;
      bottom: 10px;
      transition: 0.3s;
    }
    .nav-link:hover:after {
      width:100%;
    }
    
    .nav-link.selected:after {
      background-color: black;
      height: 1px;
      width:100%; 
    }
    .nav-link.selected {
      font-size: 18px;
      margin-top:50px;
      color: black !important;
    }
    .nav-link.person {
      font-size: 17px;
      margin-top: 58px;
      padding:0;
    }
    .nav-link.person:after {
      content: "";
      position: absolute;
      background-color: black;
      height: 1px;
      width: 0;
      left: 0;
      bottom: 4px;
      transition: 0.3s;
    }
    .nav-link.person:hover:after {
      width:100%;
    }
    
    .nav-link.person.selected:after {
      background-color: black;
      height: 1px;
      width:100%; 
    }
    .nav-link.person.selected {
      font-size: 17px;
      margin-top:58px;
      color: black !important;
    }
    .col.stacked {
      height:72px;
      margin-top: -50px;
    }
  
    #header-logo {
      height: 40px;
      margin-top:8px;
    }
    .vertical-space-for-header-two {
      padding-top:40px;
    }
    #header-logo-grave {
      height: 80px;
      margin-top: -10px;
    }
    #header-logo-column {
      text-align: left;
    }
    #header-container {
      height:50px;
      background-color: var(--bg-color);
      border-bottom:solid 1px lightgray;
    }
    #header-container-personpage {
      height:50px;
      background-color: var(--bg-color);
    }
    #header-container-row {
      height:50px;
      align-items: start;
    }
    .header_profile_picture img {
      width: 80%;
      margin-top: 10px;
    }
  
    #header-container-row-personpage {
      height: 80px;
      text-align: center;
    }
    .col.header.personpage {
      margin-top: -55px;    
      height: 78px;      
      padding: 0;
      
    }     
  }

 

/*Other sites*/
.font_text_vertriebsheader{
  font-family: mainfont;
  font-size: 40px;
  line-height: 1;
  margin-top: 6px;
  color: black;
}

.font_text_footer_bespoke{
  font-family: mainfont;
  font-size: 20px;
  line-height: 0.01;
  color: black;
}

#navbar-mobile, #navbar-mobile:focus, #navbar-mobile:active {
  margin-right:20px;
  margin-top:-2px;
  border:transparent !important;
  outline: none !important;
  box-shadow: none;
  border-color: rgba(0,0,0,.125); 
}

#navbar-mobile-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(1,1,1,1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

#navbar-mobile-vorschau, #navbar-mobile-vorschau:focus, #navbar-mobile-vorschau:active {
  margin-right:20px;
  margin-top:-2px;
  border:transparent !important;
  outline: none !important;
  box-shadow: none;
  border-color: rgba(0,0,0,.125); 
}

.bill-icon {
  width: 60px;
  height:21px !important;
  border: solid 2px black;
  border-radius: 5px;
  background: rgb(246, 246, 246);
  font-size: 11px;
  text-align: center;
  font-weight:600;
  box-shadow: 1px 1px 1px 1px rgb(186, 186, 186);
}


.mce-edit-area iframe {
  max-height: 500px;
}

.container-footer {
  background-color: var(--bg-color);
  height: 190px;
  right: 0;
  bottom: 0;
  left: 0;
  text-align: center;
  
}

.container-footer-person {
  background-color: var(--bg-color);
  height: 40px;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  text-align: center;
  opacity:0.6;
}

.container-navigation-person {
  background-color: transparent;
  height: 40px;
  position: absolute;
  right: 0;
  bottom: 60px;  
  left: 0;
  text-align: center;
}

.memorioButton_navigation {
  position:relative;
  height:40px;
  color:black;
  background: transparent; 
  border: 1px solid black; 
  border-radius: 2px;
  font-family: mainfont;
  font-size: 24px;
  line-height: 1.5;
}

.memorioButton_navigation_animation {
  position:relative;
  height:40px;
  color:transparent;
  background: transparent; 
  border: 1px solid black; 
  border-radius: 2px;
  font-family: mainfont;
  font-size: 24px;
  line-height: 1.5;
  animation: blurFadeIn 1.2s ease-in 0.1s backwards;
  animation-delay: 3s;
  text-shadow: 0px 0px 1px #000;
}


.previewImage-default {
  height: 150px;
  width: 100%;
  object-fit: contain;
  border-radius: 5px;
}


@media (max-width:1400px){
  .home-padding {
    padding:0px 20px;
  }
  .col.qrcode.text p {
    width: 90%;
    font-size:19px;
  }
  .font_text_vertriebsheader{
    font-family: mainfont;
    font-size: 28px;
    line-height: 1;
    margin-top: 6px;
    color: black;
  }
}

@media (max-width:1200px) {
 
  .home-padding {
    padding:0px 0px;
  }
}


@media (max-width:768px) {
  .font_text_footer_bespoke{
    font-family: mainfont;
    font-size: 12px;
    line-height: 0.01;
    color: black;
  }
  .font_text_vertriebsheader{
    font-family: mainfont;
    font-size: 20px;
    line-height: 1;
    margin-top: 6px;
    color: black;
  }
  .font_text_caption{
    font-family: mainfont;
    font-size: 22px;
    line-height: 0.85;
    color: black;
  }
  .memorioButton_navigation_animation {
    height:28px;
    font-size: 18px;
  }
  .memorioButton_navigation {
    position:relative;
    height:28px;
    color:black;
    background: transparent; 
    border: 1px solid black; 
    border-radius: 2px;
    font-family: mainfont;
    font-size: 18px;
    line-height: 1.5;
  }
  .container_gallery {
    column-count: 2;
  }

  
   
  .container-footer {
    background-color: var(--bg-color);
    height: 420px;
    padding-left: 60px;
    right: 0;
    bottom: 0;
    left: 0;
    text-align: center;
  }

  #logo-footer {
    display:none;
  }

  .footer-heading {
    margin-top: 15px;
    margin-bottom: 0px !important;
  }

  .container-footer-person {
    background-color: var(--bg-color);
    height: 40px;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    text-align: center;
    opacity:0.6;
  }
}

.submenu-link.vorschau {
  position: relative;
  font-family: mainfont;
  font-size: 16px;
  color: rgba(0,0,0,1) !important;
  padding: 0;
}
.submenu-link.vorschau:after {
  content: "";
  position: absolute;
  background-color: black;
  height: 1px;
  width: 0;
  left: 0;
  bottom: 4px;
  transition: 0.3s;
}
.submenu-link.vorschau:hover:after {
  width:100%;
}

.submenu-link.vorschau.selected:after {
  background-color: black;
  height: 1px;
  width:100%; 
}
.submenu-link.vorschau.selected {
  font-size: 16px;
  color: black !important;
}



.submenu-link.person {
  position: relative;
  font-family: mainfont;
  font-size: 20px;
  color: rgba(0,0,0,1) !important;
  padding: 0;
}
.submenu-link.person:after {
  content: "";
  position: absolute;
  background-color: black;
  height: 1px;
  width: 0;
  left: 0;
  bottom: 4px;
  transition: 0.3s;
}
.submenu-link.person:hover:after {
  width:100%;
}

.submenu-link.person.selected:after {
  background-color: black;
  height: 1px;
  width:100%; 
}
.submenu-link.person.selected {
  font-size: 20px;
  color: black !important;
}

#language-button {
  display:inline-block;
  white-space:nowrap;
  background:transparent;
  border:transparent;
  margin-top:25px;
  color: var(--bg-color) !important;
}

@media (max-width:768px) {
  #language-button {
   
    color: black !important;
  }
  #submenu-container-person {
   
    height:88px !important;
    width:100%;
    padding-top:55px !important;
  }
  .submenu-link.person, .submenu-link.person.selected {
    font-size: 16px;
  }
}

@media (max-width:550px) {
  
  #submenu-container-person {
    height:115px !important;
  }
  
}

.package-description {
  margin-top:0px !important;
  padding:0px 5px 0px 5px !important;
  height: 70px; 
  margin:0px 0px;
  display: table-cell;
  vertical-align: middle;
}



@media (max-width:1300px) {
  .package-description {
    height: 70px !important;
  }
}

@-moz-keyframes blink {
  0% {
      opacity:1;
  }
  50% {
      opacity:0;
  }
  100% {
      opacity:1;
  }
} 

@-webkit-keyframes blink {
  0% {
      opacity:1;
  }
  50% {
      opacity:0;
  }
  100% {
      opacity:1;
  }
}
/* IE */
@-ms-keyframes blink {
  0% {
      opacity:1;
  }
  50% {
      opacity:0;
  }
  100% {
      opacity:1;
  }
} 
/* Opera and prob css3 final iteration */
@keyframes blink {
  0% {
      opacity:1;
  }
  50% {
      opacity:0;
  }
  100% {
      opacity:1;
  }
} 
.blink-image {
  -moz-animation: blink normal 2s infinite ease-in-out; /* Firefox */
  -webkit-animation: blink normal 2s infinite ease-in-out; /* Webkit */
  -ms-animation: blink normal 2s infinite ease-in-out; /* IE */
  animation: blink normal 2s infinite ease-in-out; /* Opera and prob css3 final iteration */
}