:root {
  --spring-easing: linear(
	  /* Start to 1st bounce */
	  0, 0.004, 0.016, 0.035, 0.063 9.1%, 0.141, 0.25, 0.391, 0.563, 0.765, 1,
	  /* 1st to 2nd bounce */
	  0.891, 0.813 45.5%, 0.785, 0.766, 0.754, 0.75, 0.754, 0.766, 0.785, 0.813 63.6%, 0.891, 1 72.7%,
	  /* 2nd to 3rd bounce */
	  0.973, 0.953, 0.941, 0.938, 0.941, 0.953, 0.973, 1,
	  /* 3rd bounce to end */
	  0.988, 0.984, 0.988, 1
	);
  --spring-duration: 1s;
}

.slidecontact-open #sidecontactslide{
	transition-timing-function: var(--spring-easing);
	transition-duration:var(--spring-duration);

}

/* ============================================================
   Fixed vertikale Punktnavigation (Bootstrap-friendly)
   ============================================================ */
.dotnav{
	position: fixed;
	left: 3rem;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	flex-direction: column;
	gap: 10px;
	z-index: 1060; /* über Content, unter Bootstrap-Modals (1050/1060 ok) */
	pointer-events: auto;
}

.dotnav .dotnav-dot{
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: rgba(200,200,200,.25);
	border: 0;
	padding: 0;
	cursor: pointer;
	transition: transform .15s ease, background .15s ease, opacity .15s ease;
	opacity: .7;
}

@media all and (max-width:1340px){
	/*.dotnav{opacity:0!important;}	*/
	
	.dotnav{
		position: fixed;
        left: 0;
        right: 0;
        top: auto;
        height: 2.5rem;
        bottom: 0;
        transform: translateY(0); 
        display: flex ;
        flex-direction: row;
        justify-content: center;
        background: black;
        gap: 10px;
        z-index: 100;
		padding-top: .5rem;
        pointer-events: auto;
	}
	
	.toTheTop {
		bottom:1.2rem !important;
		right:1.2rem !important;
		color:#666 !important;
	}
}

@media all and (max-height:550px){
	#rotate{
		position:fixed;
		z-index:99999999;
		top:0;
		right:0;
		bottom:0;
		left:0;
		background:black;
		display:flex !important;
		justify-content:center;
		align-items:center;
	}	
	
	.modal {
		  padding: 0 !important;
		}
		.modal .modal-dialog {
		  width: 100%;
		  max-width: none;
		  height: 100%;
		  margin: 0;
		  padding-left:0 !important;
		  padding-right:0 !important;
		}
		.modal .modal-content {
		  height: 100%;
		  border-bottom-width: 0 !important;
		  border-top-width: 0 !important;
		  border-left-width: 0 !important;
		  border-right-width: 0 !important;
		  border-radius: 0;
		}
		.modal .modal-body {
		  overflow-y: auto;
		}
}


#modal{
	background:black !important;
	padding:0 !important;
}
.modal-dialog {
    max-width: 100%;
	width:100%;
    margin: 0;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100vh;
    display: flex;
}
.modal-content{border:0 !important;}

.modal-body{
	max-height: 100vh;
    padding: 4rem 0 !important;
}

.modal-body main > section:first-child {
    padding-top: 0rem !important;
}

.dotnav .dotnav-dot:nth-child(6){
	background: #bb2323 !important;
}

.dotnav .dotnav-dot:hover{
	transform: scale(1.35);
	opacity: 1;
}

.dotnav .dotnav-dot.is-active{
	background: rgba(200,200,200,.85);
	transform: scale(1.6);
	opacity: 1;
}

[data-wc-weight="6"]{color:#bb2323 !important;}

.modal .close{text-shadow:none;color:#ff0000 !important;}

.tooltip{opacity:1 !important;hyphens:auto;text-align:left;}
.tooltip > div.tooltip-inner{background:#bb2323;color:white;}
.tooltip[x-placement="top"] > div.arrow:before,
.tooltip:not([x-placement="top"]) > div.arrow:before{border-top-color:#bb2323 !important;}
.tooltip[x-placement="bottom"] > div.arrow:before{border-bottom-color:#bb2323 !important;}