/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Nov 02 2026 | 18:11:30 */
.e-con {
  --padding-block-start:0;
  --padding-block-end: 0;
}
.bochi-wa-element{
	transform: translateX(-10px);
}
.wa__button{
    padding: 5px;
    border-radius:20px;
}
.bochi-tel-txt{
	color: #FFFFFF !important;
	-webkit-color: #FFFFFF !important; /* Wichtig für Safari! */
    opacity: 1;
}

.king-addons-mega-menu-horizontal .king-addons-menu-items > li::before{
	/*font-family: 'Font Awesome 5 Free';
	content:'\f015'!important;*/
}
.elementor-counter-number:before{
	content: "+ ";
}

.floating-box {
  /* Positionierung am rechten Rand */
  position: fixed;
  top: 50%; /* Vertikal zentrieren */
  right: 0;
  transform: translateY(-50%) scale(0.9); /* Exakt mittig ausrichten */
  
  /* Aussehen */
  background-color: #0d6efd;
  color: white;
  padding: 10px 10px 15px 15px;
  border-radius: 5px 0 0 5px; /* Abrundung nur links */
  cursor: pointer;
  
  /* Animation / Transition */
  transition: all 0.3s ease; /* Sanfter Übergang */
  z-index: 15000;
  
  /* Ursprüngliche Größe */
  width: 60px;
  text-align: center;
  box-shadow: 6px 6px 21px rgba(0,0,0,0.6);
}

/* Hover-Effekt: Größer werden */
.floating-box:hover {
  transform:  translateY(-50%) scale(1.1); /* 10% größer + Position beibehalten */
  background-color: #0b5ed7;
	width: 120px;
  padding-right: 5px; /* Optional: Element weiter nach links "ausfahren" */
}
.float-mailicon:hover::after{
	content: "";
	vertical-align: top;
}
.floating-box1 {
  /* Positionierung am rechten Rand */
  position: fixed;
  top:40%; /* Vertikal zentrieren */
  right: 0;
  transform: translateY(-40%) scale(0.9); /* Exakt mittig ausrichten */
  /*height: 50px;*/
  /* Aussehen */
  background-color: #0d6efd;
  color: white;
  padding: 5px 20px 15px 15px;
  border-radius: 5px 0 0 5px; /* Abrundung nur links */
  cursor: pointer;
  
  /* Animation / Transition */
  transition: all 0.3s ease; /* Sanfter Übergang */
  z-index: 15000;
  
  /* Ursprüngliche Größe */
  width: 60px;
  text-align: center;
  box-shadow: 6px 6px 21px rgba(0,0,0,0.6);
}

.floating-icon{
	width:100%;
	text-align:left;
}

/* Hover-Effekt: Größer werden */
.floating-box1:hover {
  transform:  translateY(-40%) scale(1.1); /* 10% größer + Position beibehalten */
  background-color: #0b5ed7;
	width: 200px;
  padding-right: 5px; /* Optional: Element weiter nach links "ausfahren" */
}
.floating-icon{
	display:flex;
	height:50px;
	vertical-align:middle;
	align-content:center;
}

.floating-icon i{
	font-size: 35px;
	}
.floating-icon:after{
	content:'';
	font-size:0px;
	transition: all 0.4s ease-in;
}
.floating-box1:hover .floating-icon:after{
	content: '0176 432 42683';
	font-size:16px;
	padding-left:10px;
	margin-bottom:5px;
	transform: translateY(15px);
}
.king-addons-card-slider__button{
	background:#3D4754;
}
/*#34373B*/
.king-addons-card-slider__button:hover{
	background:#34373B;
}

.bochi-container-icon-for-tel{
	cursor:pointer;
	height:75.2px;
	}
.bochi-container-icon-for-tel:hover{
		transform:translateY(-3px);
}
.bochi-icon-box1{
	/*background:#24282E;*/
	/*border: 2px solid transparent;*/
  border-radius: 30px;
  background-clip: padding-box, border-box; /* */
  background-origin: border-box;
  /*background-image: 
    linear-gradient(#24282E #24282E), 
    linear-gradient(135deg, #e0e0e0, #8c8c8c, #f2f2f2, #5a5a5a, #e6e6e6);*/
  
  /* Leichter Schein/Glow für den Schimmer-Effekt */
  /*box-shadow: 0 0 15px rgba(224, 224, 224, 0.4), inset 0 0 5px rgba(255, 255, 255, 0.2);
	transition: all .2s ease-in;*/
  
}
.bochi-icon-box{
	
	border-width:0!important;
}
.bochi-icon-box:hover{
	cursor:pointer;
	/*box-shadow: 0 0 15px rgba(224, 224, 224, 0.6), inset 0 0 5px rgba(255, 255, 255, 0.1);*/
}
.bochi-icon-text h2{
	transition: all .2s ease-in;
}
.bochi-icon-box .elementor-icon {
  
  padding: 30px;
  padding-right: 32px;
  padding-left: 32px;
}
.bochi-icon-box .elementor-icon i{ 
	transition: all .2s ease-in;
}
.bochi-icon-box:hover .elementor-icon i{
	color:#FA5800;
}
.bochi-box .elementor-element p{
	transition: all .2s ease-in!important;
}
.bochi-icon-box:hover .elementor-element p{
	color:#34373B;
	transition: all .2s ease-in;
}
/*.bochi-icon-box:hover .bochi-icon-text h2, .bochi-icon-box:hover .bochi-icon.elementor-icon i{
	color:#FA5800;
}*/

/*.bochi-icon .elementor-icon{
	-webkit-box-shadow: 2px 6px 34px -12px rgba(250,88,0,0.6); 
box-shadow: 2px 6px 34px -12px rgba(250,88,0,0.6);
}*/
.bochi-button-kontakt{
	cursor:pointer;
}

.bochi-link-ds a{
	font-size:12px;
	color:#666;
}
.bochi-link-ds a:hover{
	text-decoration:underline;
}
.wpcf7-list-item-label{
	font-size:12px;
}
.elementor-kit-17 input[type="submit"]{
	box-shadow: none;
	width:100%;
}
.king-addons-card-slider .swiper{
	background: #fff!important;
	border-radius: 5px;
	padding-bottom: 15px;
}
.king-addons-card-slider__card {
	/*background: #34373B!important;*/
	/*background: #F1F1F1!important;*/
}
.bochi-beschreibung-txt{
	transform:translateY(-50px);
}
/* Menu Toggle Style Mobile Menu */
.mega-toggle-block-1.mega-toggle-animated, .elementor-kit-17 button {
	box-shadow:none!important;
}
#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-item > a.mega-menu-link{
	font-family:"Albert Sans";
}
/* Slider auf Startseite */
.king-addons-card-slider__arrow-icon{
	display:none;
}
/*andere Bootstrap -icons*/
.swiper-button-prev:before{
    font-family: "Bootstrap-icons";
    content:"\F284";
}
.swiper-button-next:before{
    font-family: "Bootstrap-icons";
    content:"\F285";
}
.bochi-counter .elementor-counter-title{
	line-height:20px; 
}
.bochi-zoom-container{
	cursor:pointer;
	background-size:110%;
	background-repeat: no-repeat;
	transition: all .2s ease-in-out!important;
}
.bochi-zoom-container:hover{
	background-size: 130%!important;
	transition: all .2s ease-in-out!important;
}
.bochi-z-container:hover .bochi-dnstl-besch{
	box-shadow: 1px 0px 10px 0px rgba(0,0,0,0.5);
}
.zoom-left:hover{
	
	background-position-x:left 95%!important;
}
.zoom-bottom:hover{
	background-position-y:bottom -3%!important;
}
.elementor-18 .elementor-element.elementor-element-77b7676 .eael-contact-form-7 .wpcf7-form p:not(:last-of-type) .wpcf7-form-control-wrap {
    /*margin-bottom: 30px;
    width: 100%;*/
}
.elementor-18 .elementor-element.elementor-element-24ad42e .eael-contact-form-7-wrapper .eael-contact-form.eael-contact-form-7{
	width:90%;
}
.bochi-cf7-label{
	margin-top:40px;
}
/* Container Text-Carussell */
.wc-carousel {
    position: relative;
    overflow: hidden;
    height: 1.6em;
    line-height: 1.6em;
    font-size: 2.25rem;
    font-weight: 600;
    text-align: center;
}

/* Die "Schiene", die sich bewegt */
.wc-carousel__track {
    display: flex;
    gap: 3em;
    white-space: nowrap;
    will-change: transform;
}

/* Einzelner Begriff */
.wc-carousel__item {
    flex-shrink: 0;
    opacity: 0.4;
    transition: opacity 0.4s ease;
}

/* Aktiver Begriff (wird per JS aktiviert) */
.wc-carousel__item.is-active {
    opacity: 1;
}

/* ===== 3D Word Ring ===== */
.wr{
	background-image: url("https://hgproperty.de/wp-content/uploads/2026/02/kompakt_r_2.png");
	background-repeat: no-repeat;
	background-size:400px auto;
	background-position: center!important;
	
}
.wr__item{
	font-size: 1.2rem;
    font-weight: 500;
    color: #666;
	/*backface-visibility: visible;*/
	backface-visibility: hidden;
	
}
.wr::after {
    content: '';
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    height: 20px;
    background: radial-gradient(ellipse, rgba(0,0,0,0.12) 0%, transparent 70%);
    border-radius: 50%;
}
.wr:hover .wc-ring__ring {
    animation-play-state: paused;
}
.wc-ring {
    display: flex;
	background-image: url("https://hgproperty.de/wp-content/uploads/2026/02/kompakt_r_2.png");
	background-repeat: no-repeat;
	background-size:300px auto;
	background-attachment: fixed;
  background-position: center;
    align-items: center;
    justify-content: center;
    height: 220px;
    overflow: visible;
}

/* Szene: hier wird die Perspektive gesetzt.
   Je kleiner der Wert, desto stärker der 3D-Effekt. */
.wc-ring__scene {
    width: 100%;
    height: 100%;
    perspective: 600px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Der rotierende Ring.
   transform-style: preserve-3d ist entscheidend –
   ohne ihn werden die Children in eine 2D-Ebene "geflacht". */
.wc-ring__ring {
    position: relative;
    width: 0;
    height: 0;
    transform-style: preserve-3d;
    /* Die Animation wird per JS gesetzt, da speed und tilt variieren */
}

/* Einzelner Begriff.
   Position wird per JS via rotateY + translateZ gesetzt. */
.wc-ring__item {
    position: absolute;
    top: 50%;
    left: 50%;
    white-space: nowrap;
    font-size: 1.5rem;
    font-weight: 300;
    color: #666;
    /* backface-visibility: hidden → Begriff verschwindet,
       wenn er nach hinten zeigt. Das sieht sauberer aus.
       Setze auf "visible", wenn du Durchsichtigkeit willst. */
    backface-visibility: visible;
}
/* ===== Logo-Item ===== */

.wc-ring__item--logo {
	backface-visibility: visible;
	display: flex;
    align-items: center;
    justify-content: center;
}

.wc-ring__item--logo img {
    width: 50px;
    height: 30px;
	/*filter: brightness(11%) contrast(165%) saturate(99%) blur(0) hue-rotate(277deg);*/
    object-fit: contain;
	transform: none;
}
.wc-ring::after {
    content: '';
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    height: 20px;
    background: radial-gradient(ellipse, rgba(0,0,0,0.12) 0%, transparent 70%);
    border-radius: 50%;
}
.wc-ring:hover .wc-ring__ring {
    animation-play-state: paused;
}
/*===Word-Ticker Plugin===*/
.ticker-wrapper {
    overflow: hidden;
    white-space: nowrap;
    width: 100%;
    position: relative;
}

.ticker-track {
    display: inline-flex;
    will-change: transform;
}

.ticker-content {
    display: inline-block;
    line-height: 4;
    
}
.ticker-pic{
    display: flex;
    align-items: center; /* Zentriert den Text vertikal zum Bild */
    
}
.ticker-pic span img{
    padding-right:5px!important;
	transform:translateX(20px);
	
	
}
.ticker-pic .ticker-pic-span{
    min-width:600px;
    text-align:center;
}
.ticker-pic p{
    margin-bottom:0!important;
	
}
.rcb-sc-link, .cookie-ctl{
	font-size: 12px !important;
	color: #999999 !important;
}
.cookie-ctl i{
	font-size: 28px;
}
.container-bottom-h1{
	cursor:pointer;
	text-align:center;
	padding-left:5px;
	padding-top:5px;
	border-radius:5px;
}
.container-bottom-h1 h2{
	text-align:center;
	padding-left:20px!important;
	margin-top:5px!important;
}
.container-bottom:hover .container-bottom-h1{
	background:#F1F1F1;
}
.container-bottom .container-bottom-h1:after{
	display: block;
	font-family: "Bootstrap-icons";
	font-size:25px;
    content:" \F279";
	color: #FF5A00;
	transform: translate(0px,-25px);
	transition: all 0.5s ease-in-out;
	
}
.container-bottom:hover .container-bottom-h1:after{
	font-size:45px;
}


.container-bottom-wrapper{
	display: grid;
	cursor:pointer;
	border:0px solid #F1F1F1;
  grid-template-rows: 320px 80px;/*-------320px 80px-----*/
	transform:translateY(-40px);/*----- -40px -----*/
  transition: all 0.5s ease-in-out;
}
.container-bottom-content, .container-bottom-button{
	overflow: hidden;
}
.container-bottom-txt{
	padding:20px;
	width:100%;
}
.container-bottom:hover .container-bottom-wrapper{
	border: 1px solid #F1F1F1;
	 grid-template-rows: 320px 80px;
	transform:translateY(-40px);
}
.container-bottom-button{
	/*width:0;*/
	/*height:0;/*-----------*/
	--align-self: flex-end;/*---------*/
	background:rgba(255,255,255,0)!important;
	transition: all .7s ease-in-out;
}
.container-bottom:hover  .container-bottom-button{
	--align-self: flex-end;
	/*width:inherit;*/
	/*height:inherit;/*-------------*/
	/*background:#34373B!important;*/
}
.container-bottom-button:hover{
	/*display:block;*/
}
/* Der Hauptcontainer */
.expand-box {
  border: 1px solid #ccc;
  width: 300px;
}

.trigger {
  padding: 15px;
  background: #f0f0f0;
  cursor: pointer;
}

/* Der geheime Bereich – standardmäßig geschlossen (0 fr) */
.content-wrapper {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.5s ease-in-out; /* Hier wird die Zeit eingestellt */
}

/* Wichtig: Verhindert, dass der Text im geschlossenen Zustand herausguckt */
.content {
  overflow: hidden;
}
/* Bei Hover: Öffnet das CSS-Grid auf die volle Inhaltsgröße (1 fr) */
.expand-box:hover .content-wrapper {
  grid-template-rows: 1fr;
}

/* Optional: Abstand für den Text innen */
.content-wrapper:hover .content {
  padding: 15px;
}


@media(min-width: 1250px){
	.bochi-termin-container{
		--content-width:100%!important;
		
	}
}
@media(min-width: 1750px){
	.bochi-termin-container{
		--content-width:80%!important;
		
	}
}
@media(max-width: 1920px){
	.bochi-container-headline{
		margin-top:100px;
	}
}