/*
 * CSS Definitionen für www.malimeister.de
 * Copyright (c) 2025 BigMammut Webdesign
 *
 */

body {
	font-family:Verdana,Arial,Sans Serif;
}

.bm-homepage,
.bm-username,
.bm-firma,
.bm-preisvorstellung,
.bm-weiss {
  position: absolute !important;
  left: -9999px !important;
  top: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  visibility: hidden !important;
}

div.malilogo {
	height: 87px;
	width: 348px;
	background: url(/images/malilogo.png);
	background-image: url(/images/malilogo.svg), none;
	background-repeat: no-repeat;
}

div.malilogo h1 {
	display: none;
}

.bg-body-tertiary {
  background-color: #FFF !important;
}

.navbar {
  z-index:10000;
  padding-top: 15px;
}

.navbar-nav {
  height:85px;
  width: 100%;
  border-bottom: 7px solid #000;
  --bs-nav-link-padding-y: 0px;
  padding-left: 40px;
  --bs-nav-link-color: #000;
  --bs-nav-link-hover-color: #FFF;
  --bs-navbar-nav-link-padding-x: 20px;
  font-size: 1.3em;
}

.nav-link {
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
}

.nav-link:hover {
  -border-bottom: 7px solid #78A240;
  -margin-bottom: -7px;
  background-color: #78A240;
  text-decoration:none;
}

.navbar {
  --bs-navbar-padding-y: 10px;
  --bs-navbar-brand-padding-y: 0px;
  --bs-navbar-brand-margin-end: 3px;
  box-shadow: 0 .5rem 1rem #00000026,inset 0 -1px #ffffff26;
}

.navbar>.container {
  padding-left: 5px;
}

.mt-4 {
  margin-top: 2.0rem !important;
}
.my-5 {
  margin-top: 2.0rem !important;
  margin-bottom: 0rem !important;
}


.img-compare-wrapper {
  position: relative;
  width: 1500px;
  max-width: 100%;
  aspect-ratio: 7/4;
  margin: 0 auto;
  overflow: hidden;
  background: #ccc;
  border-radius: 12px;
  user-select: none; /* 1. ganz wichtig */
  box-shadow: 0 6px 24px rgba(0,0,0,0.09);
}

.img-compare-wrapper *,
.ic-bar,
.ic-handle {
  user-select: none; /* 1b. für alle Kinder! */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}


.ic-img {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  pointer-events: none;
  user-drag: none;
  -webkit-user-drag: none;
}

.ic-before {
  z-index: 2;
  transition: -webkit-mask-image 0.15s, mask-image 0.15s;
}

.ic-after { z-index: 1; }
.ic-slider { position: absolute; z-index: 20; width: 0; pointer-events: none;}
.ic-bar {
  position: absolute; top: 0; bottom: 0; width: 7px; left: 50%;
  background: #DFDFDF; border-radius: 4px; margin-left: -3.5px; z-index: 30;
  cursor: ew-resize; pointer-events: all; display: flex; align-items: center; justify-content: center;
  transition: background 0.15s;
}

.ic-handle {
  display: inline-block;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 3px solid #fff;
  background: #2196f3;
  box-shadow: 0 2px 10px #1a73e833;
}


.form-control,
.form-check-input[type=checkbox] {
  border: 1px solid #28a745;
}

.form-control:focus {
  border-color: #78A240;
  box-shadow: 0 0 0 0.2rem rgba(0, 95, 46, 0.25);
}

.form-check-input:checked {
  background-color: #78A240;
  border-color: #78A240;
}

.my-select + .select2-container {
  width: 100% !important;
}

.my-select + .select2-container .select2-selection {
  width: 100% !important;
}
/* Hintergrund der aktiven/hoverten Auswahl */
.select2-container--default .select2-results__option--highlighted {
  background-color: #78A240 !important;
  color: white;
}

/* Hintergrund der aktuell gewählten Option im Feld */
.select2-container--default .select2-selection--single {
  border: 1px solid #28a745;
  border-radius: 0.38rem !important;
}

/* Fokus-Stil (Rand beim Klick auf Feld) */
.select2-container--default.select2-container--focus .select2-selection--single {
  border-color: #78A240;
  box-shadow: 0 0 0 0.2rem rgba(0, 95, 46, 0.25);
}

.select2-results__option {
  padding: 2px 7px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container--default .select2-selection--single .select2-selection__arrow {
  line-height: 38px !important;
}

.select2-container .select2-selection--single {
  height: 38px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  margin-top: 1px;
}

#ergebnis.alert {
  --bs-alert-margin-bottom: 0px;
}


h2 {
  font-size: 1.6rem;
}

a {
  color: #D51F26;
  text-decoration:none;
}

a:hover {
  text-decoration:underline;
}

.carousel-inner {
  border-radius: 10px;
}

.carousel-caption {
  background-color: rgba(0, 0, 0, 0.2); 
  padding: 0.6rem;
  border-radius: 0.5rem;
}

.carousel-caption h5,
.carousel-caption p {
  color: #fff !important; /* Weiße Schrift für gute Lesbarkeit */
}
.alert-primary,
.alert-success,
.alert-info {
  --bs-alert-color: #78A240;
  --bs-alert-border-color: #78A240;
  --bs-alert-bg: #F4F8F4;
}

.hinweis-kostenvoranschlag {
  font-size: 0.7em;
  margin-bottom: 0px;
  padding: 5px 10px 10px 10px;
}

.btn-primary {
  --bs-btn-bg: #78A240;
  --bs-btn-border-color: #78A240;
  --bs-btn-hover-bg: #69873E;
  --bs-btn-hover-border-color: #69873E;
  --bs-btn-active-bg: #5C703E;
  --bs-btn-active-border-color: #5C703E;
}

em.mask, sub.mask {
	display: none;
}

.footer {
  margin-top: 30px;
  padding-top:30px;
  background-color: #DFDFDF;
  font-size: 0.9em;
}

h3 {
  font-size: 1.2rem;
}

h4 {
  font-size: 1rem;
  font-weight:bold;
}

.desk-small-on {
  display: none;
}

.desk-small-off {
  display:  block;
}

.mobile-on {
  display:  none;
}

.summary-table {
  width: 100%;
  margin-top: 2em;
  border-collapse: collapse;
}
.summary-table th, .summary-table td {
  padding: 10px;
  border-bottom: 1px solid #e0e0e0;
}

a.bm-alert:hover {
  text-decoration:none !important;
}

div.bm-alert:hover {
  --bs-alert-bg: #CCE0CC;
}

.logo-center {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

@media print {
    body * {
      visibility: hidden;
    }
    #druckbereich, #druckbereich * {
      visibility: visible;
    }
    #druckbereich {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      background: #fff;
      padding: 2em;
      box-sizing: border-box;
    }
    #druckbutton, .navbar, .footer {
      display: none !important;
    }
    #printlogo {
      display: block !important;
      margin-bottom: 2em;
    }
    .summary-table th, .summary-table td {
      border: 1px solid #ddd !important;
      padding: 8px !important;
    }
    .summary-table tr:nth-child(even) {
      background: #f9f9f9 !important;
    }
    .summary-table th {
      background: #e9ecef !important;
      font-weight: bold;
    }
}



@media (max-width: 1199px) {
  .mobile-on {
    display:  none;
  }
  
  .desk-small-on {
    display: block;
  }
  
  .desk-small-off {
    display:  none;
  }
}

@media (max-width: 991px) {  
  .navbar-collapse {
    margin-left: 7px;
    margin-top: 0px;
    background-color: #F0F0F0 !important;
  }
  
  .navbar-nav {
    height: unset;
    padding-left: 0px;
    border-bottom: none;
  }
  
  .nav-item {
    width: 100%;
  }
  
  .nav-link {
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
    padding: 3px 0px 3px 8px;
    font-size: 0.9em;
  }
  
  .align-items-end {
    align-items: flex-start !important;
  }
  
  .mobile-on {
    display:  block;
  }
  
  .mobile-off {
    display:  none;
  }
}

@media (max-width: 767px) {
  div.malilogo {
  	height: 60px;
  	width: 241px;
  	background: url(/images/malilogo.png);
  	background-image: url(/images/malilogo.svg), none;
  	background-repeat: no-repeat;
  }
  
  .navbar-collapse {
    margin-left: 5px;
  }
  
  .navbar-collapse {
    
  }
  
  .desk-small-off {
    display: block;
  }
  
  .desk-small-on {
    display:  none;
  }
  
  .mobile-on {
    display:  none;
  }
  
  .mobile-off {
    display:   block;
  }
  
  .img-compare-wrapper {
    margin-bottom: 30px;
  }
  
  .mt-5.startseite,
  .my-5.leistungen {
    margin-top:5px !important;
  }
}

@media (max-width: 589px) {

}

@media (max-width: 465px) {

}

@media (max-width: 440px) {

}

@media (max-width: 425px) {

}

@media (max-width: 375px) {
  
}