/*
Theme Name: MZ
Theme URI: https://zens-media.de
Description: MZ Theme
Author: Marcel Zens
Author URI: https://zens-media.de
Template: yootheme
Version: 1.0
*/

.toCourseButton {
   font-size: 16px !important;
}

footer {
  margin-top: 100px;
}

.signature-row {
  margin-bottom: 50px;
}

.signature {
font-family: Babylonica;
  font-weight: inherit;
  font-size: 50px;
}


#order_review_heading{
    float: left !important;
    width: calc(50% - (5px / 2));
 
    /* margin-left: 20px; */
  }

  #BorlabsCookieDebugConsole{
    display:none!important;
  }

  .ppcp-disabled{
    display:none !important;
  }

  .other-products h1 {
    font-size: 1rem !important;
  }

  .uk-accordion-title {
    cursor: pointer !important;
  }
  /* #page\#0 {
  position: absolute;
  width: auto;
  height: 800px;
  top: 50vh;
  left: 48vw;
  transform: translate(-50%, -50%);
} */

* + .uk-h1, * + .uk-h2, * + .uk-h3, * + .uk-h4, * + .uk-h5, * + .uk-h6, * + .uk-heading-2xlarge, * + .uk-heading-3xlarge, * + .uk-heading-large, * + .uk-heading-medium, * + .uk-heading-small, * + .uk-heading-xlarge, * + h1, * + h2, * + h3, * + h4, * + h5, * + h6 {
  margin-top: 20px !important;
}

.paypal-button-container {
  padding-top:10px !important;
    display:none !important;
}

#order-review .ppcp-messages, .paypal-powered-by {
  display:none !important;
}

.uk-navbar-primary .uk-navbar-nav > li > a {
  font-size: 20px !important;
  font-weight:bolder !important;
}

  .uk-navbar-transparent .uk-navbar-nav > li.uk-active > a {
    color:#740202 !important;
  }

    .uk-navbar-transparent .uk-navbar-nav > li > a {
    color:#eeeeee !important;
  }

   .uk-navbar-transparent .uk-navbar-nav > li > a:hover {
     color:#740202 !important;
  }

   .page-id-159 .uk-navbar-transparent .uk-navbar-nav > li.uk-active > a {
    color:#740202 !important;
  }

   .page-id-159 .uk-navbar-transparent .uk-navbar-nav > li > a {
    color:#666 !important;
  }

   .page-id-159 .uk-navbar-transparent .uk-navbar-nav > li > a:hover {
     color:#740202 !important;
  }

  .wpro-pre-order-availability-date{
    font-weight:800;
      color:#740202 !important;
  }



 .woocommerce-checkout-review-order {
    float: left !important;
    width: calc(50% - (5px / 2));
 
    margin-left: 20px;
  }

  .shop_table.woocommerce-checkout-review-order-table td{
    padding-left:10px;
  }

  .woocommerce table.shop_table :not(thead) > th, .woocommerce table.shop_table td {
  padding: 5px 5px!important;
    padding-right: 12px;
  vertical-align: middle;
}

.toCourseButton.disabled{
  /* display: none; */
  /* color: #740202 !important; */
  color: grey !important;
 
 
  pointer-events: none;
  cursor: not-allowed !important;
}

.wpcw_fe_progress_box {
    display: flex;
    flex-direction: column;
}

.wpcw_fe_progress_box_text {
    order: 2; /* Verschiebe den Textblock ans Ende */
    margin-top: 10px;
}

@-webkit-keyframes rotateIcon {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@keyframes rotateIcon {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.futureiconlarge svg {
  height: 250px;
  width: 250px;
  -webkit-animation: rotateIcon 10s linear infinite;
  animation: rotateIcon 10s linear infinite;
}

.wpcw_fe_progress_box_mark {
    order: 1; /* Position des Markierungsblocks */
}


 .mz-unitcontainer .wp-video {
 display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto; /* Zentriert das Element innerhalb seines Containers */
    max-width: 100%; /* Verhindert, dass das Video breiter wird als der Container */
 }

  .mz-unitcontainer .wp-video video {
  display: block; /* Entfernt unnötige Inline-Effekte */
    max-width: 100%; /* Sorgt dafür, dass das Video auf mobilen Geräten skaliert */
    height: auto; /* Erhält das Seitenverhältnis */
 }

.irs--round .irs-bar {
  background-color: #740202 !important;
}

.irs--round .irs-from, .irs--round .irs-to, .irs--round .irs-single {
    background-color: #740202 !important;
}

.irs--round .irs-handle {

  border: 4px solid #740202 !important;

}

.woocommerce-MyAccount-content .bpa-front-cp-left-sidebar{
  display: none!important;
}

.woocommerce-MyAccount-content .bpa-front-cp-card {
  border:none!important;
}

.woocommerce-Price-amount{
  font-size: 1rem;
}
#order_review_heading {
  width:100%!important;
}

.irs--round .irs-from::before, .irs--round .irs-to::before, .irs--round .irs-single::before {

  border-top-color: #740202 !important;
}

.fairy-hero img{
    /* max-width:800px; */
      
     position: absolute;
    width: auto; /* Erhalte die Proportionen des Bildes */
    height: 666px; /* Festgelegte Höhe des Bildes */
    
    /* Zentrierung mit `vh` */
    top: 50vh; /* 50% der Viewport-Höhe */
    left: 50vw; /* 50% der Viewport-Breite */
      transform: translate(-50%, -50%); 

      max-width: 800px;
  position: absolute;
  width: auto;
  height: 666px;
  top: 43vh;
  left: 49vw;
  transform: translate(-50%, -50%);
}

.header-signature {
  top: 68vh !important;
  z-index: 1;
  transform: translateX(0vw);
  will-change: transform;
}

.footer-bottom .uk-nav a {
  color : #777 !important;
}

.footer-bottom .uk-nav a:hover {
 color:#740202 !important;
}



.mobile-menu .uk-nav > li > a {
  padding: 3px 0;
  font-size: 16px;
}

.uk-nav-default > li > a {
  color: #f1e1c7 !important;
}

.uk-navbar-toggle, .uk-navbar-item.widget.widget_builderwidget {

  color: #f1e1c7 !important;

}



 .header-star-1 svg {
    width: 50px; 
    height: 50px; 
  }

   .header-star-2 svg {
     width: 20px; 
    height: 20px; 
  }

   .header-star-3 svg {
     width: 20px; 
    height: 20px; 
  }
 .header-star-4 svg {
    width: 50px; 
    height: 50px; 
  }
 .header-star-5 svg {
    width: 20px; 
    height: 20px; 
  }
 .header-star-6 svg {
    width: 35px; 
    height: 35px; 
  }
 .header-star-7 svg {
     width: 50px; 
    height: 50px; 
  }
 .header-star-8 svg {
    width: 35px; 
    height: 35px; 
  }

  .header-star-8 svg {
    width: 150px; 
    height: 150px;
  }

    .header-star-9 svg {
    width: 150px; 
    height: 150px;
  }

  .uk-offcanvas-bar {
    width: 100% !important
  }

.youtube-video {
    position: relative;
    width: 100%; /* Full width */
    padding-top: 56.25%; /* 16:9 Aspect Ratio */
    overflow: hidden;
}

.youtube-video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; /* Full height */
}

/* .saeulen .uk-panel {
    background-color: #fff;

} */

  .header-star svg path {
    fill: #e3c686; 
  }


.uk-section-secondary.uk-section-overlap, .footer-callto{
    position: relative; /* Macht die Section zum Bezugspunkt für die Pseudo-Elemente */
}

.uk-section-secondary.uk-section-overlap::before, .footer-callto::before, .footer-callto::after,
.uk-section-secondary.uk-section-overlap::after {
    content: ''; /* Fügt ein leeres Element ein */
    position: absolute;
    left: 0;
    right: 0;
    height: 209px; /* Höhe der Hintergründe */
    background-repeat: repeat-x; /* Nur horizontal wiederholen */
   background-size: 4000px 209px;
    z-index: 2; /* Hintergrund hinter dem Inhalt platzieren */
    pointer-events: none; /* Klicks nicht blockieren */
}

.uk-section-secondary.uk-section-overlap::before {
    top: -209px; /* Position über der Section */
    background-image: url('https://aura-magie.de/wp-content/uploads/2024/12/wellen_rot_4k.png');
}



.uk-section-secondary.uk-section-overlap::after, .footer-callto::after {
    bottom: -209px; /* Position unter der Section */
    background-image: url('https://aura-magie.de/wp-content/uploads/2024/12/wellen_rot_4k_inv.png');
}

/* .footer-callto::after {
  margin-bottom:200px;
} */


  .footer-callto::before{
      top: -209px; /* Position unter der Section */
    background-image: url('https://aura-magie.de/wp-content/uploads/2024/12/wellen_rot_4k.png');
}

.footer-bottom {
  margin-top: 100px;
}



.triangle {
  position: relative;
  width: 300px; /* Breite der Bilder */
  height: 300px;
  transform-style: preserve-3d;
  position: absolute;
  left:30vw;;
  top:18vh;
}

.side {
  position: absolute;
  width: 300px; /* Breite des quadratischen Bildes */
  height: 300px; /* Höhe des quadratischen Bildes */
  transform-origin: center center; /* Transformation von der Mitte */
  transform: 
    rotateY(calc(var(--i) * 120deg)) /* 120°-Rotation für 3 Seiten */
    translateZ(150px); /* Positionierung nach vorne (Hälfte der Breite) */
}

.side img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Bild passt sich an den Bereich an */
 
}

.saeulen .uk-panel.uk-padding {
    background-color: rgba(255, 255, 255, 0.3); /* Weiß mit 20% Transparenz */
   
    padding: 15px; /* Innenabstand für Lesbarkeit */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Weicher Schatten */
    margin:20px;
}



/* Ausgangszustand */
/* Hauptstern */
.star-banner svg {
    position: absolute;
    top: 50%;
    right: -100px;
    transform: translateY(-50%) rotate(0deg);
    animation: move-and-rotate 5s linear infinite;
    z-index:-1!important;
}

/* Alle Sterne */
.star-ani {
    position: absolute;
    top: 50%;
    right: -100px;
    transform: translateY(-50%) rotate(0deg);
    animation: move-and-rotate 5s linear infinite;
}

/* Bewegung und Drehung */
@keyframes move-and-rotate {
    0% {
        right: -100px;
        transform: translateY(-50%) rotate(0deg);
    }
    100% {
        right: calc(100vw + 100px);
        transform: translateY(-50%) rotate(360deg);
    }
}


/* Hauptstern */
.star-banner-ani svg {
    position: absolute;
    top: 50%;
    right: -100px;
    transform: translateY(-50%) rotate(0deg);
    animation: move-and-rotate 5s linear infinite;
}

/* Pseudoelemente für den Schweif */
.star-banner-ani::before,
.star-banner-ani::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -100px;
    width: 100px;
    height: 100px;
    background: transparent;
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d=\'M92.068,39.055H61.021L51.427,9.527a1.5,1.5,0,0,0-2.854,0L38.979,39.055H7.932a1.5,1.5,0,0,0-.882,2.714l25.118,18.25L22.574,89.545a1.5,1.5,0,0,0,2.308,1.678L50,72.974,75.118,91.223a1.5,1.5,0,0,0,2.308-1.678L67.832,60.019,92.95,41.769a1.5,1.5,0,0,0-.882-2.714ZM65.187,58.231a1.5,1.5,0,0,0-.545,1.678l8.5,26.173L50.882,69.905a1.5,1.5,0,0,0-1.764,0L26.854,86.082l8.5-26.173a1.5,1.5,0,0,0-.545-1.678L12.548,42.055H40.069A1.5,1.5,0,0,0,41.5,41.019L50,14.845l8.5,26.174a1.5,1.5,0,0,0,1.427,1.036H87.452Z\' fill=\'#d3d3d3\' /></svg>') no-repeat center;
    -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d=\'M92.068,39.055H61.021L51.427,9.527a1.5,1.5,0,0,0-2.854,0L38.979,39.055H7.932a1.5,1.5,0,0,0-.882,2.714l25.118,18.25L22.574,89.545a1.5,1.5,0,0,0,2.308,1.678L50,72.974,75.118,91.223a1.5,1.5,0,0,0,2.308-1.678L67.832,60.019,92.95,41.769a1.5,1.5,0,0,0-.882-2.714ZM65.187,58.231a1.5,1.5,0,0,0-.545,1.678l8.5,26.173L50.882,69.905a1.5,1.5,0,0,0-1.764,0L26.854,86.082l8.5-26.173a1.5,1.5,0,0,0-.545-1.678L12.548,42.055H40.069A1.5,1.5,0,0,0,41.5,41.019L50,14.845l8.5,26.174a1.5,1.5,0,0,0,1.427,1.036H87.452Z\' fill=\'#d3d3d3\' /></svg>') no-repeat center;
    transform: translateY(-50%) rotate(0deg );
    animation: move-and-rotate 5s linear infinite;
    opacity: 0.5;
}

/* Verzögerungen */
.star-banner-ani::before {
    animation-delay: 0.2s;
    opacity: 0.3;
}
.star-banner-ani::after {
    animation-delay: 0.4s;
    opacity: 0.2;
}

/* Bewegung und Drehung */
@keyframes move-and-rotate {
    0% {
        right: -100px;
        transform: translateY(-50%) rotate(0deg);
    }
    100% {
        right: calc(100vw + 100px);
        transform: translateY(-50%) rotate(360deg);
    }
}


/* Bewegung und Drehung */
@keyframes move-and-rotate {
    0% {
        right: -100px;
        transform: translateY(-50%) rotate(0deg);
    }
    100% {
        right: calc(100vw + 100px);
        transform: translateY(-50%) rotate(360deg);
    }
}


/* Farbwechsel */



@media (max-width: 1920px) {


.fairy-hero img{
    max-width:360px;
}

 .header-star-1 svg {
    width: 50px; 
    height: 50px; 
  }

   .header-star-2 svg {
     width: 20px; 
    height: 20px; 
  }

   .header-star-3 svg {
     width: 20px; 
    height: 20px; 
  }
 .header-star-4 svg {
    width: 50px; 
    height: 50px; 
  }
 .header-star-5 svg {
    width: 20px; 
    height: 20px; 
  }
 .header-star-6 svg {
    width: 35px; 
    height: 35px; 
  }
 .header-star-7 svg {
     width: 50px; 
    height: 50px; 
  }
 .header-star-8 svg {
    width: 35px; 
    height: 35px; 
  }


.booking-elve{
    left:-50px !important;
}

}

@media (max-width: 1200px) {

     .uk-heading-xlarge {
    font-size: 7rem !important;
  }

}

@media (max-width: 1676px) {

     .uk-heading-xlarge {
    font-size: 4.5rem !important;
  }

 .header-star-1 svg {
    width: 50px; 
    height: 50px; 
  }

   .header-star-2 svg {
     width: 20px; 
    height: 20px; 
  }

   .header-star-3 svg {
     width: 20px; 
    height: 20px; 
  }
 .header-star-4 svg {
    width: 50px; 
    height: 50px; 
  }
 .header-star-5 svg {
    width: 20px; 
    height: 20px; 
  }
 .header-star-6 svg {
    width: 35px; 
    height: 35px; 
  }
 .header-star-7 svg {
     width: 50px; 
    height: 50px; 
  }
 .header-star-8 svg {
    width: 35px; 
    height: 35px; 
  }


  .uk-heading-large {
    font-size: 5rem !important;
  }

.booking-elve{
    left:-150px !important;
}

}


@media (max-width: 428px) {
 .header-star-1 svg {
    width: 50px; 
    height: 50px; 
  }

   .header-star-2 svg {
     width: 20px; 
    height: 20px; 
  }

   .header-star-3 svg {
     width: 20px; 
    height: 20px; 
  }
 .header-star-4 svg {
    width: 50px; 
    height: 50px; 
  }
 .header-star-5 svg {
    width: 20px; 
    height: 20px; 
  }
 .header-star-6 svg {
    width: 35px; 
    height: 35px; 
  }
 .header-star-7 svg {
     width: 50px; 
    height: 50px; 
  }
 .header-star-8 svg {
    width: 35px; 
    height: 35px; 
  }


  /* Ändert die Farbe des SVG */


  /* Optional: Wenn das SVG eine Umrandung hat */
  /* .header-star svg path {
    stroke: black; 
    stroke-width: 2px; 
  } */

.fairy-hero img{
    max-width:320px;
}

.booking-elve{
    left:-50px !important;
}
    
     .uk-heading-xlarge {
    font-size: 2.5rem !important;
  }

}



@media (max-width: 320px) {
 .header-star-1 svg {
    width: 50px; 
    height: 50px; 
  }

   .header-star-2 svg {
     width: 20px; 
    height: 20px; 
  }

   .header-star-3 svg {
     width: 20px; 
    height: 20px; 
  }
 .header-star-4 svg {
    width: 50px; 
    height: 50px; 
  }
 .header-star-5 svg {
    width: 20px; 
    height: 20px; 
  }
 .header-star-6 svg {
    width: 35px; 
    height: 35px; 
  }
 .header-star-7 svg {
     width: 50px; 
    height: 50px; 
  }
 .header-star-8 svg {
    width: 35px; 
    height: 35px; 
  }

  .header-star-9 svg {
    width: 50px; 
    height: 50px; 
  }


  /* Ändert die Farbe des SVG */


  /* Optional: Wenn das SVG eine Umrandung hat */
  /* .header-star svg path {
    stroke: black; 
    stroke-width: 2px; 
  } */

.fairy-hero img{
    max-width:200px;
}

.booking-elve{
    left:-50px !important;
}
    
     .uk-heading-xlarge {
    font-size: 2rem !important;
  }

  .uk-heading-medium {
  font-size: 1.7rem !important;
  
}

.uk-h2, h2 {
  font-size: 20.0px;
  line-height: 1.3;
  font-family: Baskervville;
  font-weight: 800;
}

.fairy-footer img{
    max-width:100px;
}

.fairy-mobile img{
    max-width:100px;
}

.fairy-footer {
  left:0px !important;
    position: relative;
    width: 100%;
  
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 3;
}

.uk-width-small {
  width:100% !important;
}

.footer-bottom .uk-nav a {
  color: #777 !important;
}

.uk-offcanvas-overlay .uk-margin{
  margin-top:5px !important;
   margin-bottom:5px !important;
  

}

.uk-logo img {
  max-height:40px !important;
  width:auto !important;
}

.uk-nav-secondary > :not(.uk-nav-divider) + :not(.uk-nav-header, .uk-nav-divider) {
  margin-top: 3px !important;
}


}

