.elementor-1439 .elementor-element.elementor-element-cefc5e7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-1439 .elementor-element.elementor-element-c70b0b5{--display:flex;--min-height:100vh;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:flex-start;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:20%;--padding-bottom:0%;--padding-left:0%;--padding-right:0%;}.elementor-1439 .elementor-element.elementor-element-c70b0b5:not(.elementor-motion-effects-element-type-background), .elementor-1439 .elementor-element.elementor-element-c70b0b5 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#000000;}.elementor-1439 .elementor-element.elementor-element-44c6d11{--display:flex;}@media(min-width:768px){.elementor-1439 .elementor-element.elementor-element-c70b0b5{--width:100%;}}/* Start custom CSS for container, class: .elementor-element-c70b0b5 */.elementor-container {
  position: relative;
  pointer-events: none;
}/* End custom CSS */
/* Start custom CSS */.my-carousel-wrapper {
  overflow: hidden;
  position: relative;
}


.my-carousel {
  position: relative; /* vorher absolute*/
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) rotateX(-19deg);
  perspective: 2000px;
  transform-style: preserve-3d;
  width: 100%;
  height: 100%;
}

#dragger {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
   background: rgba(255, 0, 0, 0.1);
   z-index: 1000;
   pointer-events: all;
}

#ring {
  transform-style: preserve-3d;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
}

#ring,
.carousel-panel {
  pointer-events: none; /* Sie fangen keine Klicks ab */
}

.carousel-panel {
  border: 1px solid red;
  position: absolute;
  width: 120px;  /* ODER responsive */
  height: 300px;
  background: #fff; /* Testfarbe */
  background-size: cover;
  background-position: center;
  transform-style: preserve-3d;
  
}/* End custom CSS */