@charset "utf-8";
/* CSS Document */


   :root {
      --vh: 100vh; /* hilft bei mobilen Browsern */
      --slides-per-view: 5;        /* Desktop */
      --gap: 10px;
      --sticky-top: 0px;           /* wird per JS = Header-Höhe gesetzt */
      --edge-fade: 40px;
      --card-w: 320px;
      --card-h: 220px;
      --shadow: 0 8px 24px rgba(0,0,0,.12);
      --speed: .6s;
    }




.hometop::before {
  content: "\f015";
  display: block;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}

#lpmainmenu > ul.nav > li a {
  white-space: nowrap;
}


h1, section:not(#philosophy, .festsitzend, .herausnehmbar, .service) h2 {
color:#283055;
}


section:not(.vorteile, .service, .seminare) h3,
section:not(.vorteile, .service, .seminare) h4 {
font-weight:bold;
color:#283055;
}


#lpmainmenu > ul.nav  > li > a {
  border:1px solid #283055;
}

#lpmainmenu > ul.nav  > li:hover > a, #lpmainmenu > ul.nav  > li.active > a {
    color: #283055 !important;
    background-color: #fff;
  border:1px solid #283055;
}


.vorteile {
  position: relative;
    color:#fff;
}
 

.vorteile::before {
  content:"";
  display: block;
  width:100%;
  height:100%;
  /*background:rgba(233,240,246,0.8);
  background:rgba(62,118,165,0.7);
  background:rgba(0,72,133,0.7);*/
  background:#283055;
  position: absolute;
  top:0;
  backdrop-filter: blur(15px);
}
 

.media_image {
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #283055;
  border-radius: 100%;
  width: 100%;
  max-width: 450px;
  aspect-ratio: 1/1;
  padding: 15px;
position:relative;
  overflow: hidden;
}

.media_image img {
  border: 0px solid #ccc;
  border-radius: 100%;
  width: 100%;
  aspect-ratio: 1/1;
  overflow: hidden;
}


.media_image[class*="evhdle_"] {
  cursor: pointer;
}



.media_image[class*="evhdle_"]::after {
  content:"\f002";
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #283055;
  border-radius: 100%;
  width: 50px;
  height: 50px;
  padding: 15px;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position:absolute;
  bottom:10px;
}



.content-media {
  text-align: center;
}
 
.content-media .kaufen {
  margin:30px 0;
}


.shortvideoitem {
  aspect-ratio: 1/1;
  max-height:450px;
  max-width:450px;
min-width: 300px;
    padding:12px;
  border-radius: 100%;
  border: 1px solid #283055;
  overflow:hidden;
/*pointer-events:none;*/
}

.shortvideoitem_inner {
   position: relative;
  aspect-ratio: 1/1;
  max-height:500px;
  max-width:500px;
  border-radius: 100%;
  border: 0px solid #ccc;
  overflow:hidden;
}

.shortvideoitem_inner .videobox_content > div  {
  position: absolute;
  top:-200px;
  left:50%;
  transform: translate(-50%, 0);
  width: 900px;
  height: 900px;
}

.shortvideoitem_inner video {
  min-height:500px;
  width:100%;
}


#vid_premiumline_usage .shortvideoitem_inner .videobox_content > div  {
  top:-220px;
}


#vid_premiumline_usage .shortvideoitem_inner video  {
 -webkit-filter: brightness(100%);
}

#vorteile, #advantages, #avantages, #ventajas {
  padding: 100px 0 0;
}
 

.vorteile .x-column {
 /* width: calc(100%/7); */
}
 
.vorteile .more_btn,
.service .more_btn,
.pflege .more_btn {
display:none;
}

.vorteile .x-column .xcol-pic-box  {
  margin-bottom: 0px;
}

.vorteile .x-column .xcol-pic-box a {
  display:flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border:3px solid #fff;
  aspect-ratio: 1/1;
  width: 180px;
  height: 180px;
  border-radius: 100%;
  padding: 15px;
  margin: 50px 0;
}
 

.vorteile .x-column img {
  display: block;
  margin: auto;
  width: 150px;
}
 

.vorteile .contenttext h4  {
  margin-bottom: 30px;
}

.festsitzend, .herausnehmbar  {
color:#fff;
padding: 260px 0;
}

.festsitzend *, .herausnehmbar *, .service * {
color:#fff;
}

.festsitzend h2, .herausnehmbar h2 {
font-weight:bold;
}


#content .x-column > a[href*="shop."], .kaufen {
    color: #283055;
    border: 1px solid #283055;
}

#content .x-column > a[href*="shop."]:hover, .kaufen:hover {
    color: #fff;
    background: #283055;
    border: 1px solid #283055;
}

#content .x-column > a[href*="shop."]::before, .kaufen::before {
  color:#fff;
  background: #283055;
}

.dent_btn_white.kaufen:hover {
  color: rgb(40, 66, 106) !important;
}

.dent_btn_white.kaufen::before {
  color: #fff;
  background: transparent;
}

.dent_btn_white:hover.kaufen::before {
  color: rgb(40, 66, 106) !important;
}


/**/
     details.product-group {
            position: relative;
            margin-bottom: 30px;
            border-radius: 100px;
            background: #fff;
            border-left: 1px solid #f0f0f0;
            border-right: 1px solid #f0f0f0;
            border-bottom: 1px solid #f0f0f0;
            transition: all linear 0.5s;
        }

         details[open].product-group {
         border-color: #ccc;
        }

         details.product-group > summary {
            display: flex;
            align-items: center;
            padding: 5px;
            background:#f0f0f0;
            border-radius: 100px;
            box-shadow: 0 0 5px rgba(0,0,0,0.3);
            cursor: pointer;
            transition: all linear 0.5s;
        }


         details[open].product-group > summary {
            background:#ccc;
        }

        details.product-group .course_thumb {
              min-width: 100px;
              max-width: 100px;
              height: 100px;
              overflow: hidden;
              display: flex;
              border-radius: 100%;
              margin-right: 15px;
              background: #fff;
              align-items: center;
              justify-content: center;
            }


        /* details[open].product-group > summary {
            background:#ccc;
        }*/

         details[open].product-group > summary {
            background: rgb(40, 66, 106) !important;
           color:#fff;
        }

        details[open].product-group > summary h3 {
           color:#fff !important;
        }



        details[open].product-group  summary ~ * {
          animation: sweep .5s ease-in-out;
        }

        @keyframes sweep {
          0%    {opacity: 0; margin-left: -10px}
          100%  {opacity: 1; margin-left: 0px}
        }


         details.product-group > div {
            padding: 20px;
            opacity: 0;
            transition: all linear 2.5s;
        }

         details[open].product-group > div {
            opacity: 1;
        }



 
        .product-group-content {
            display:flex;
            align-items: center;
            justify-content: center;
            flex-wrap: wrap;
        }

            .product-group-text {
                width: 50%;
            }

             .product-group-gallery {
             max-width: 330px;
                 width: 50%;
              }
 
    .shop-product-button {
          width: 100%;
          margin: 20px auto;
          text-align: center;
        }


 
           .product-group-gallery-item {
              display: none;
            }




            .product-group-gallery-item.active {
              display: block;
              padding: 10px;
              margin-top: 10px;
            }

.product-group-gallery-item .shortvideoitem_inner .videobox_content > div  {
  position: absolute;
  top:-110px;
  left:50%;
  transform: translate(-50%, 0);
  width: 500px;
  height: 500px;
}

.product-group-gallery-item .media_image {
  width: 300px;
}

             .product-group-gallery-thumbnails {
                display: flex;
                align-items: center;
                justify-content: center;
                width: 300px;
                margin: auto;
              }


            .thumblink:nth-of-type(1) {
              display: flex;
              align-items: center;
              justify-content: center;
              text-decoration: none;
              background-color: #eee;
              color: #333;
              padding: 5px;
              border-radius: 200px;
              width:50px;
              height:50px;
              overflow: hidden;
              margin: 10px 5px;
            }

            .thumblink:nth-of-type(1)::before {
              display: flex;
              content:"\f04b";
              font-family:"Font Awesome 5 Free";
              font-weight: 900;
              color:#fff;
            }


            .thumblink:not(.active)::before {
              color:#666 !important;
            }



            .thumblink {
              display: flex;
              align-items: center;
              justify-content: center;
              text-decoration: none;
              background-color: #eee;
              color: #333;
              padding: 5px;
              border-radius: 200px;
              width:50px;
              height:50px;
              overflow: hidden;
              margin: 10px 5px;
            }

             .thumblink img {
              display: flex;
              height: 100%;
              border-radius: 200px;
              object-fit: cover;
            }

           .thumblink.active {
              /*background-color: #069;*/
              background-color: #283055;
              color: #fff;
            }



.zoom-overlay {
  position: fixed;
  display: none;
  z-index: 999999999 !important;
  top:50%;
  left: 50%;
  max-width: 600px;
  transform:translate(-50%, -50%);
  box-shadow: 0 0 50px rgba(0,0,0,0.3);
  border-radius: 5px;
  overflow: hidden;
}

.zoom-overlay.show {
  display: flex;
  flex-direction: column;
}

    .zoom-container {
      box-shadow: 0 0 12px rgba(0, 0, 0, 0.2);
      position: relative;
      touch-action: none;
    }

    .zoom-container img {
      width: 100%;
      height: auto;
      display: block;
      transition: transform 0.2s ease, transform-origin 0.1s ease;
    }

    .zoom-container.zoomed img {
      transform: scale(2); /* Zoomfaktor */
    }


/**/


.pflege .contenttext {
text-align:center;
}




/****TESTIMONIAL Gallery****/

.testimonials {
padding:100px 0 0;
background: color-mix(in oklab, canvas, black 3%);
}
}

    *{ box-sizing: border-box; }
    html,body{ margin:0; font-family: system-ui, sans-serif; }


    .sticky-section{ position:relative; min-height: 1300px !important;}
    .pinner{ position:sticky; top:0; z-index:10; background: color-mix(in oklab, canvas, black 3%); padding-bottom:1rem; }

    .h-gallery{
      display:flex; gap:var(--gap);
      overflow-x:scroll; overflow-y:scroll;
      scroll-snap-type:x mandatory; scroll-behavior:smooth; scroll-padding-inline:50%;
      -webkit-overflow-scrolling:touch;
      border-radius:1rem; box-shadow:0 8px 24px rgba(0,0,0,.12);
      background: color-mix(in oklab, canvas, black 3%);
      scrollbar-width:none; -ms-overflow-style:none;
      -webkit-mask-image: linear-gradient(to right, transparent 0, black var(--edge-fade), black calc(100% - var(--edge-fade)), transparent 100%);
              mask-image: linear-gradient(to right, transparent 0, black var(--edge-fade), black calc(100% - var(--edge-fade)), transparent 100%);
    }
    .h-gallery::-webkit-scrollbar{ display:none; }

.sticky-section,
.sticky-section > * { overflow: visible !important; }

    .spacer{
      pointer-events:none;
      flex:0 0 calc(50% - ((100% - (var(--gap) * (var(--slides-per-view) - 1))) / var(--slides-per-view)) / 2);
    }

  /*  .slide{
      position:relative;
      flex:0 0 calc((100% - (var(--gap) * (var(--slides-per-view) - 1))) / var(--slides-per-view));
      scroll-snap-align:center; scroll-snap-stop:always;
      display:grid; place-items:center;
      min-height:min(92vh, 900px);
      max-width: 500px;
      padding: clamp(5px, 2vw, 5px);
      background:transparent;
      transform: scale(.96); opacity: 1;
      transition: transform .25s ease, opacity .25s ease;
    }
*/

    .slide{
      position:relative;
      flex:0 0 calc((100% - (var(--gap) * (var(--slides-per-view) - 1))) / var(--slides-per-view) );
      scroll-snap-align:center; scroll-snap-stop:always;
      display:grid; place-items:center;
      min-height:850px;
      max-width: 450px;
      padding: clamp(8px, 2vw, 16px);
      background:transparent;
      transform: scale(.96); opacity: 1;
      transition: transform .25s ease, opacity .25s ease;
    }
    .slide.is-near{ transform:scale(.98); opacity:1.0; }
    .slide.is-center{ transform:scale(1); opacity:1; z-index:1; }

    .reel{
      aspect-ratio:9/16; width:100%; height:auto; max-height:86vh;
      position:relative; overflow:hidden; border-radius:24px;
      box-shadow:0 12px 40px rgba(0,0,0,.25);
      background-color:#fff;
      background-image: url(https://wWW.dentaurum.de/images/schmuckbg_zangen.webp);
      background-repeat: no-repeat;
      background-size: 120%;
      background-position: 0px -80px;
    }

    .reel:has(.card-inner){
      background-color:#fff;
      background-image: none;
      background-repeat: no-repeat;
    }
    .reel > video, .reel > iframe{ width:100%; height:100%; display:block; border:0; object-fit:cover; }
    .clappr-mount{ width:100%; height:100%; }


  .slide-imgbox {
    position: relative;
    margin-bottom: 0px;
  }

    .slide-picbox {
      position: relative;
      top: 20px;
      width: 200px;
      height: 200px;
      background:#fff;
      overflow: hidden;
      border-radius: 1000px;
      margin: 0 auto 30px;
      aspect-ratio: 1/1;
      border: 5px solid #ebbe00;
    }

    .slide-picbox img{ width:100%; display:block; }
    .slide-txtbox{
     position: relative;
     top: 10px;
     width:100%;
     /*height:100%;*/
     padding: clamp(10px,1vw,20px);
     /*! background:#ccc; */
     font-size: clamp(12px,2vw,18px);
}



.img_caption p {
      color:#999;
      font-weight: 400 !important;
      font-size: 18px !important;
}


    .slide-txtbox p {
      font-size: clamp(12px, 2vw, 16px) !important;
      line-height: 150%;
      color: #003c6f;
      font-weight: 400 !important;
      font-size: 16px !important;
    }

.exp_header {
color:#ebbe00 !important;
}



   .dots{
      display:flex;
      justify-content:center; align-items:center;
      gap:.5rem; margin-top:.75rem;
      user-select:none; position: absolute;
      bottom: 10%;z-index: 9999;
      transform: translateX(-50%);left: 50%;
      padding: 10px 10px;
      background: rgba(255,255,255,0.6);
      border-radius: 10px;
     }

    .dots .dot{
      appearance:none; border:0; width:15px; height:15px; border-radius:999px;
      background: #666; opacity:.45; cursor:pointer;
      transition: width .18s ease, opacity .18s ease, background-color .18s ease;
    }
    .dots .dot:is(:hover,:focus-visible){ opacity:.85; outline:none; }
    .dots .dot.is-active{ opacity:1; background: #069; }

/*
*/



@media screen and (max-width:520px) {
 
          details.product-group > div {
          padding: 10px;
        }
         details summary h3 {
          font-size: 14px;
          margin:0px 0 5px;
          line-height: 120%;
        }

         details summary p {
          font-size: 12px;
           margin: 0;
           line-height: 100%;
        }
 
          details.product-group .course_thumb {
              min-width: 50px;
              height: 50px;
            margin-right: 5px;
            }
 
  .product-group-content {
    display: flex;
    justify-content: center;
    text-align: center;
  }
 
          .product-group-content  > div{
            width: 100%;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }
 
        .product-group-gallery {
            max-width: 230px;
            width: 100%;
          }
 
         details .shortvideoitem {
          min-width: 220px;
        }
 
  .product-group-gallery-thumbnails {
      max-width: 250px;
    }

 
  .product-group-gallery-item .media_image {
  width: 220px;
}
}