/* Theme Color */
.ds-47111881 {margin-bottom:1rem;}
.ds-47111881 p, code {color:#cdcdcd;}
.ds-47111881 a {color:#cdcdcd;}
.time-counter .time-countdown .counter-column,
.error-section .error-title span,
.order-box ul li span,
.checkout-page .default-links li a:hover,
.checkout-page .default-links li .fa,
.cart-section .totals-table .total .price,
.cart-table tbody tr .remove-btn,
.shop-comment-form .rating-box .rating a:hover,
.comments-area.style-two .comment-box .rating,
.comments-area.style-two .comment-info span,
.product-details .basic-details .details-header .item-price,
.product-details .basic-details .details-header .rating,
.shop-item .inner-box .lower-content .rating .fa,
.shop-item .inner-box .lower-content .price,
.shop-item .inner-box .lower-content h3 a:hover,
.comments-area .comment-box .date,
.sidebar .related-posts .post .rating .fa,
.sidebar .related-posts .post a,
.sidebar .related-posts .post a:hover,
.latest-news .post:hover h5 a,
.sidebar .search-box .form-group input[type="submit"],
.sidebar .search-box .form-group button,
.cat-list li.active a,
.cat-list li:hover a,
.main-footer.style-three .footer-bottom .social-links li a:hover,
.main-footer.style-three .footer-bottom .copyright-text a,
.main-footer .title-column .text span,
.main-footer .contact-info-list li a:hover,
.main-footer.style-two .footer-bottom .copyright-text a,
.subscribe-area .title-column .text span,
.popular-posts .post h4 a:hover,
.main-footer .list li a:hover,
.main-footer .list li:before,
.main-footer .about-widget .social-links li a:hover,
.accordion-box .block .icon,
.accordion-box .block .acc-btn.active,
.blog-detail .post-controls h5 a:hover,
.blog-detail .post-controls .title a:hover,
.news-block-two h3 a:hover,
.news-block-three .content-column .link-box a:hover,
.news-block-three .content-column .link-box a i,
.news-block-three .content-column .info li i,
.news-block-three .content-column .info li a:hover,
.news-block-three .content-column h3 a:hover,
.news-carousel-two .owl-next:hover,
.news-carousel-two .owl-prev:hover,
.news-block-two .lower-content .info li i,
.news-block-two .lower-content .info li a:hover,
.news-block-two .lower-content h4 a:hover,
.news-section .owl-next:hover,
.news-section .owl-prev:hover,
.news-block .content-column .link-box a:hover,
.news-block .content-column .link-box a i,
.news-block .content-column .info li i,
.news-block .content-column .info li a:hover,
.news-block .content-column h3 a:hover,
.pricing-table.tagged .table-footer a,
.pricing-table .inner-box:hover .table-footer a,
.pricing-table .price span,
.pricing-table .price,
.team-carousel .owl-next:hover,
.team-carousel .owl-prev:hover,
.team-block .lower-content .name a,
.team-block .lower-content .name,
.team-block .overlay-box .email a:hover,
.team-block .social-links li a:hover,
.fun-fact-section-two .icon,
.fun-fact-section .counter-column:nth-child(3n + 3) .icon,
.fun-fact-section .counter-column:nth-child(3n + 4) .icon,
.products-carousel .owl-next:hover,
.products-carousel .owl-prev:hover,
.product-block .lower-content .rating,
.product-block .lower-content .price,
.product-block .lower-content .name a:hover,
.call-to-action-two .btn-box a,
.call-to-action .btn-column .message-box,
.post-controls .load-more a:hover,
.post-controls .next:hover a,
.post-controls .prev:hover a,
.accordion-box.style-three .block .acc-btn.active,
.project-detail .owl-next:hover,
.project-detail .owl-prev:hover,
.projects-carousel-three .owl-next:hover,
.projects-carousel-three .owl-prev:hover,
.project-block-three .lower-content .name a:hover,
.project-block-three .lower-content .category,
.project-block-three .btn-box a,
.projects-section-two .owl-next:hover,
.projects-section-two .owl-prev:hover,
.projects-section-two .message-box .text a,
.project-block-two .link-box a i,
.project-block-two .link-box a,
.project-block .overlay-box .link-box a i,
.project-block .overlay-box .link-box a:hover,
.mixitup-gallery .filters li.active,
.mixitup-gallery .filters li:hover,
.testimonial-block .info-box .rating,
.appointment-form .message-box span,
.testimonial-block .info-box .name,
.feature-block h5 a:hover,
.feature-block .icon,
.brochure-box .theme-btn,
.sidebar .brochure-link a i,
.service-tabs .tab-btns .tab-btn:hover,
.service-tabs .tab-btns .tab-btn.active-btn,
.accordion-box.style-two .block .icon,
.accordion-box.style-two .block .acc-btn.active,
.services-carousel-three .owl-next:hover,
.services-carousel-three .owl-prev:hover,
.service-block-three .icon-box .icon,
.services-carousel-two .owl-next:hover,
.services-carousel-two .owl-prev:hover,
.service-block-two h5 a:hover,
.service-block-two .icon-box .icon,
.services-carousel .owl-next:hover,
.services-carousel .owl-prev:hover,
.service-block .overlay-box .link-box a i,
.service-block .overlay-box .link-box a:hover,
.service-block .caption-box h4 a:hover,
.about-section .content-column .link-box a i,
.about-section .content-column .link-box a:hover,
.banner-section-three .owl-next:hover,
.banner-section-three .owl-prev:hover,
.banner-section-three .link-box a:hover,
.banner-section-three .link-box a i,
.banner-section-three h4,
.banner-section-two .link-box a:hover,
.banner-section-two .link-box a i,
.banner-section-two h4,
.banner-carousel .owl-next:hover,
.banner-carousel .owl-prev:hover,
.banner-section .link-box a:hover,
.banner-section .link-box a i,
.page-title .bread-crumb li a:hover,
.page-title .bread-crumb li:before,
.sec-title .title,
.sticky-header .main-menu .navigation > li:hover > a,
.sticky-header .main-menu .navigation > li.current > a,
.sticky-header .main-menu .navigation > li.current-menu-item > a,
.main-header .search-box-btn:hover,
.header-style-three .share-btn a,
.header-style-three .main-menu .navigation > li:hover > a,
.header-style-three .main-menu .navigation > li.current > a,
.header-style-three .main-menu .navigation > li.current-menu-item > a,
.header-style-two .share-btn a:hover,
.header-style-two .search-btn:hover,
.main-header .main-menu .navigation > li:hover > a,
.main-header .main-menu .navigation > li.current > a,
.main-header .main-menu .navigation > li.current-menu-item > a,
.main-header .info-box li a:hover,
.list-style-one li:before,
.theme_color,
a{
	color: #bb54e1;
}

/*=== Background Color ===*/
.payment-box .payment-options li .radio-option label .small-text,
.checkout-page .lower-content .column h2:after,
.shipping-form button,
.cart-section .totals-table .proceed-btn,
.cart-section .coupon-btn,
.cart-section .cart-options .cart-btn,
.shop-single .product-details .prod-tabs .tab-btns .tab-btn:hover,
.shop-single .product-details .prod-tabs .tab-btns .tab-btn.active-btn,
.shop-item .overlay-box .like a:hover,
.shop-item .overlay-box .tag,
.comments-area .comment-box .reply-btn,
.range-slider-one .ui-state-default,
.range-slider-one .ui-widget-content .ui-state-default,
.tag-list li a:hover,
.main-footer .footer-bottom,
.blog-detail .post-share-options .social-icon li a,
.blog-detail blockquote cite:before,
.news-section-three .owl-dot,
.news-block-two .lower-content .date span,
.news-block-two .overlay-box:before,
.news-block .row:before,
.news-section,
.pricing-tabs .tab-btns .tab-btn.active-btn,
.team-block .inner-box:hover .lower-content,
.fun-fact-section:before,
.services--list li .icon,
.product-block .image-box .tag,
.accordion-box.style-three .block .icon,
.project-block-three .overlay-box:before,
.testimonial-carousel .owl-dot,
.work-tabs .tab-btns .tab-btn.active-btn,
.brochure-box .theme-btn:hover,
.table-style-one tbody tr:last-child th:first-child,
.service-block-three .link-box a,
.service-block-three .inner-box:before,
.service-block-two .link-box a,
.service-block .caption-box .icon,
.about-section .image-column .image-box:before,
.sec-title .title:after,
.header-style-three .call-btn:before,
.header-style-three .main-menu .navigation > li > a:before,
.header-style-three .main-menu .navigation > li > a:after,
.header-style-two .main-menu .navigation > li > a:before,
.main-header .main-menu .navigation > li > a:before,
.main-menu .navigation > li .mega-menu-bar ul,
.main-header .header-top .inner-container,
.main-header .header-top:before,
.scroll-to-top:hover,
.btn-style-one{
	background-color: #bb54e1;
}

/*Border Color*/




.login-form .form-group input[type="text"]:focus,
.login-form .form-group input[type="password"]:focus,
.login-form .form-group input[type="tel"]:focus,
.login-form .form-group input[type="email"]:focus,
.login-form .form-group select:focus,
.login-form .form-group textarea:focus,
.coupon-form .form-group input[type="text"]:focus,
.checkout-form input:focus,
.checkout-form select:focus,
.checkout-form textarea:focus,
.shipping-form .form-group input[type="text"]:focus,
.shipping-form .form-group input[type="password"]:focus,
.shipping-form .form-group input[type="tel"]:focus,
.shipping-form .form-group input[type="email"]:focus,
.shipping-form .form-group select:focus,
.shipping-form .form-group textarea:focus,
.shop-comment-form input:focus,
.shop-comment-form select:focus,
.shop-comment-form textarea:focus,
.shop-comment-form .form-group input[type="text"]:focus,
.shop-comment-form .form-group input[type="password"]:focus,
.shop-comment-form .form-group input[type="tel"]:focus,
.shop-comment-form .form-group input[type="email"]:focus,
.shop-comment-form .form-group select:focus,
.shop-comment-form .form-group textarea:focus,
.comment-form .form-group input:focus,
.comment-form .form-group select:focus,
.comment-form .form-group textarea:focus,
.range-slider-one .ui-state-default,
.range-slider-one .ui-widget-content .ui-state-default,
.tag-list li a:hover,
.sidebar .search-box .form-group input:focus,
.main-footer .contact-info-list li .icon,
.contact-form-two .form-group input:focus,
.contact-form-two .form-group select:focus,
.contact-form-two .form-group textarea:focus,
.main-footer .subscribe-form .form-group input:focus,
.styled-pagination li a:hover,
.styled-pagination li.active a,
.blog-detail blockquote,
.news-carousel-two .owl-next:hover:before,
.news-carousel-two .owl-prev:hover:before,
.news-section .owl-next:hover:before,
.news-section .owl-prev:hover:before,
.contact-form .form-group input:focus,
.contact-form .form-group select:focus,
.contact-form .form-group textarea:focus,
.pricing-tabs .tab-btns .tab-btn.active-btn,
.pricing-table.tagged .table-footer a,
.pricing-table .inner-box:hover .table-footer a,
.team-carousel .owl-next:hover:before,
.team-carousel .owl-prev:hover:before,
.product-block .inner-box:hover .image-box,
.post-controls .next:hover:before,
.post-controls .prev:hover:before,
.project-detail .owl-next:hover:before,
.project-detail .owl-prev:hover:before,
.projects-carousel-three .owl-next:hover:before,
.projects-carousel-three .owl-prev:hover:before,
.projects-section-two .owl-next:hover:before,
.projects-section-two .owl-prev:hover:before,
.appointment-form .form-group input:focus,
.appointment-form .form-group textarea:focus,
.appointment-form .form-group select:focus,
.brochure-box .theme-btn:hover,
.service-tabs .tab-btns .tab-btn:hover,
.service-tabs .tab-btns .tab-btn.active-btn,
.service-tabs .tabs-content,
.services-carousel-three .owl-next:hover:before,
.services-carousel-three .owl-prev:hover:before,
.services-carousel-two .owl-next:hover:before,
.services-carousel-two .owl-prev:hover:before,
.services-carousel .owl-next:hover:before,
.services-carousel .owl-prev:hover:before,
.banner-carousel .owl-next:hover:before,
.banner-carousel .owl-prev:hover:before,
.banner-section-three .owl-next:hover:before,
.banner-section-three .owl-prev:hover:before,
.header-style-two .search-panel input:focus,
.header-style-two .search-panel select:focus,
.main-header .search-box .form-group input:focus,
.main-header .info-box .icon-box{
	border-color: #bb54e1;
}


.payment-box .payment-options li .radio-option label .small-text:before,
.pricing-table .inner-box,
.main-header .main-menu .navigation > li > a:after{
	border-bottom-color: #bb54e1;
}

.pricing-table .inner-box,
.work-tabs .tab-btns .tab-btn.active-btn:after{
	border-top-color: #bb54e1;
}

@media only screen and (max-width: 767px){

	.main-menu .navbar-header .navbar-toggler .icon{
		color:#bb54e1;
	}

	.main-menu .navbar-header .navbar-toggle,
	.main-menu .navbar-collapse > .navigation,
	.main-menu .navbar-collapse > .navigation > li > ul,
	.main-menu .navbar-collapse > .navigation > li > ul > li > ul,
	.main-menu .navbar-collapse > .navigation > li > a,
	.main-menu .navbar-collapse > .navigation > li > ul > li > a,
	.main-menu .navbar-collapse > .navigation > li > ul > li > ul > li > a,
	.main-menu .navbar-collapse > .navigation > li > a:hover,
	.main-menu .navbar-collapse > .navigation > li > a:active,
	.main-menu .navbar-collapse > .navigation > li > a:focus,
	.main-menu .navbar-collapse > .navigation > li:hover > a,
	.main-menu .navbar-collapse > .navigation > li > ul > li:hover > a,
	.main-menu .navbar-collapse > .navigation > li > ul > li > ul > li:hover > a,
	.main-menu .navigation > li .mega-menu-bar .column > ul > li > a,
	.main-menu .navigation > li .mega-menu-bar .column > ul > li:hover > a,
	.main-menu .navigation > li .mega-menu-bar .column > ul > li > a,
	.main-menu .navigation > li .mega-menu-bar .column > ul > li:hover > a,
	.main-menu .navbar-collapse > .navigation > li.current > a,
	.main-menu .navbar-collapse > .navigation > li.current-menu-item > a{
		background-color:#bb54e1;
	}

}

      
@keyframes fadeInwerbung {
  from {
    opacity: 0;
    transform: scale(0.75);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
#werbungModal {
  z-index: 999999;
  position: fixed; /* Wichtig für z-index */
}
#open-1, #open-2 {
	z-index: 999999;
}
.modal-backdrop {
  z-index: 999998; /* Overlay direkt unter dem Modal */
}
#werbungModal .modal-content {
  animation: fadeInwerbung 1.8s ease-out;
}
      
#werbungModal .modal-dialog {
  max-width: 600px;
  max-height: 90vh; /* Modal-Höhe auf 90% der Viewport-Höhe beschränken */
}

#werbungModal .modal-content {
  border: 5px solid #bb54e1; /*  Rahmen um das gesamte Modal */
  border-radius: 0; /* Keine abgerundeten Ecken */
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2); /* Schattierung */
  overflow: hidden; /* Inhalt bleibt innerhalb des Rahmens */
  display: flex;
  flex-direction: column; /* Stellt sicher, dass der Inhalt und der Footer korrekt angeordnet sind */
}

#werbungModal .modal-body {
  flex-grow: 1; /* Der Body füllt den verfügbaren Platz */
  overflow-y: auto; /* Scrollen innerhalb des Modals ermöglichen */
  padding: 0; /* Kein zusätzlicher Abstand um das Bild */
}

#werbungModal .modal-body img {
  max-width: 100%;
  height: auto;
}

#werbungModal .close-button {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(193, 7, 147, 0.8); /* Grüner, halbtransparenter Hintergrund */
  color: white;
  font-size: 20px;
  font-weight: bold;
  border: none;
  border-radius: 50%; /* Kreisförmiger Button */
  cursor: pointer;
  z-index: 10;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2); /* Leichter Schatten */
  transition: all 0.3s ease; /* Sanfter Übergang bei Hover */
}

#werbungModal .close-button:hover {
  background-color: rgba(193, 7, 147, 1); /* Vollere Farbe beim Hover */
  transform: scale(1.1); /* Leichtes Vergrößern */
}