/* CSS Document */


.navbar {
  background: linear-gradient(90deg, #0c2437 0%, #133352 100%) !important;
  box-shadow: 0 2px 18px #1333522e;
}

.navbar .navbar-brand,
.navbar .nav-link,
.navbar .navbar-text {
  color: #e9f1fb !important;
  transition: color 0.15s;
}
.navbar .nav-link.active,
.navbar .nav-link:hover {
  color: #40c8e6 !important;
}

.navbar-nav .nav-link.active,
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus {
  color: #00b5ad !important; /* deine Logofarbe */
}




.badge-warning-custom {
  background-color: #fd7e14;
  color: #fff;
}



.custom-icon {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

.graustufen {
	filter: grayscale(100%);
	-webkit-filter: grayscale(100%); /* Für ältere Browser */
}


  a {
    color: #789C0F;
  }
a:hover {
  color: #64820C;
}

.text-iggh {
    color: #99C221;
 }

.iggh_gruen {
	    color: #99C221 !important;
}

.form-control:focus {
    color: #000000;
    background-color: #ffffff;
    border-color: #789C0F;
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(173, 206, 77, 0.25); }


.navbar-brand img {
  width: auto;
  max-height: 3.0rem;
}



.breadcrumb-item {
    font-size: 0.75em;
}




.page-item.active .page-link {
  z-index: 3;
  color: #fff;
  background-color: #477283;
  border-color: #477283;
}




h1,h2,h3,h4,h5,p {
    hyphens: auto;
}


	@media (max-width: 767px) { 
		.show_scroll_down {
			display: none!important;
		}
	}
	@media (min-width: 768px) { 
		.show_scroll_down {
			transform: rotate(-45deg);
			animation: scrollDown 1.4s infinite; 
		}
	}


@media (max-width: 575.98px) { 
    .navbar {
        padding-bottom: 1rem;
    }
    .row-distance-vert-custom {
        height: 0;
    }
    
    .navbar-brand img {
        max-height: 3.0rem !important;
    }
    
    div.sul-illustration {
         max-width: 100% !important;
        overflow: hidden;
    }
    div.sul-illustration img {
        margin-top: 50px;
        margin-bottom: 50px;
         transform: scale(2.0, 2.0);       
    }     
}


@media (max-width: 575.98px) { 
    .align-neum-kalender{
		padding-left:20px!important;
        text-align: left;
    }     
}

@media (min-width: 576px) {         
    .align-neum-kalender{
 		padding-left:20px!important;
		text-align: center;        
    } 
    .row-distance-vert-custom {
        margin-top: 100px;
    }    
}



/* X-Small devices (portrait phones, less than 576px)  */
@media (max-width: 767.98px) { 
    #div_fbe_id {
        display: none;
    }
    #div_form_id {
        display: none;
    }    
}

.btn {
    font-weight: 500;
    border: none; 
}
.btn-outline-white {
    border: thin white solid !important;
}

.btn-primary {
  color: white;
  background-color: #6B8F9C;
  border-color: #477283;
}
.btn-primary:hover {
  color: white;
  background-color: #477283;
  border-color: #477283;
}
.btn-secondary {
  color: white;
  background-color: #4C5F71;
  border-color: #36495B;
}
.btn-secondary:hover {
  color: white;
  background-color: #36495B;
  border-color: #36495B;
}

.btn-green {
  color: white;
  background-color: #99C221;
  border-color: #98C120;
}
.btn-green:hover {
  color: white;
  background-color: #789C0F;
  border-color: #779B0E;
}


.bg-green {
  background-color: #99C221 !important;  /* #1d4b40 */
}
.bg-blue {
  background-color: #6B8F9C !important;  /* #1d4b40 */
}
.bg-danger {
  background-color: #A70033 !important;  /* #1d4b40 */
}


.text-iggh {
    color: #99C221;
}


.form-check-input:checked {
  background-color: #99C221;
  border-color: #789C0F !important;
}

.form-check-input.alarm:checked {
background-color: #FF0000; /* Rot */
border-color: #CC0000; /* Dunkleres Rot */
}



.nav-link {
    font-weight: 500;
}



.dropdown-menu .dropdown-item.active {
    font-weight: 500;
}


.card-hover-gray:hover {
    color: #000 !important;
    background: #EFEFEF;
}

.list-group-item.list-group-item-action:hover {
    color: #000 !important;
    background: #EFEFEF;
}


#home_start {
    height: 300px;
    max-height: 300px !important;
}



a[type='button'] {
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;

 }

.faq_answer {
   font-size: 0.875em; 
   color: #777777 !important;
}



footer {
    background-color: #F2F2F2;;
}

.nav-link {
    padding-bottom: 2px;
}


/*-------- Section backgrounds----------------------------*/
.section-light-gray {
    background-color: #F2F2F2;
}


.green-light {    color: #6F802A; }
.green-lighter {  color: #D5E0A9; }

.red-light {    color: #A70033; }
.red-lighter {    color: #DDA1B3; }

.violett-light {    color: #8377E3; }
.violett-lighter {    color: #ABADDE; }

.orange-light {    color: #E67613; }
.orange-lighter {  color: #F0BD91; }

/*
.navbar-light .navbar-nav .nav-link.active {    
    color: rgba(0, 0, 0, 0.9);  
    border-bottom: 10px #BEDDCB solid;
}
*/

/*--------CropIt  Profilfoto ------------------------*/
  .cropit-preview {
        background-color: #f8f8f8;
        background-size: cover;
        border: 1px solid #ccc;
        border-radius: 3px;
        margin-top: 7px;
        width: 400px;
        height: 400px;	   
      }
     .cropit-preview-image-container {
        cursor: move;
      }

      .image-size-label {
        margin-top: 10px;
      }
	  .cropit-preview-image {
				max-width: none;
	  }



.embed-responsive .embed-responsive-item, .embed-responsive iframe, .embed-responsive embed, .embed-responsive object, .embed-responsive video {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}




.form-floating > label {
    color: #888;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    padding: 1rem 0.75rem;
    pointer-events: none;
    border: 1px solid transparent;
    transform-origin: 0 0;
    transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out;
}

.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label {
    opacity: 0.8;
    transform: scale(0.8) translateY(-0.5rem) translateX(0.15rem);
}



.list-group-item-noborder {
    border-left: none !important;
    border-right: none !important;
	padding-left: 0 !important;
	padding-right: 0 !important;	
}

.abstand_gering {
    line-height: 50%;
}

div.card-body.bg-blue.text-white a { color: #fff !important; }
div.card-body.bg-red.text-white a { color: #fff !important; }

#news_block table tbody td {
	border: thin solid #333;
}


footer {
  font-size: 1.0rem;
}


      .cropit-anlagefoto-preview {
        background-color: #f8f8f8;
        background-size: cover;
        border: 1px solid #ccc;
        border-radius: 3px;
        margin-top: 7px;
        width: 800px;
        height: 600px;
        cursor: move;
      }

      .cropit-flyer-background {
        opacity: .2;
        cursor: auto;
      }




/* Modernisiertes alert-info Styling */
/* Basis-Style für alle Alerts */
.alert {
  border-left: 6px solid transparent;
  border-radius: 0.75rem;
  padding: 1.25rem 1.5rem;
  font-size: 1rem;
  box-shadow: 0 0.125rem 0.75rem rgba(0, 0, 0, 0.04);
  position: relative;
  margin-bottom: 1.5rem;
}

/* Alert Info – Frisches Blau */
.alert-info {
  background-color: #e6f4fd;
  border-left-color: #0d6efd;
  color: #084298;
}

/* Alert Danger – Modernes Rot */
.alert-danger {
  background-color: #fde8e9;
  border-left-color: #dc3545;
  color: #842029;
}

/* Alert Warning – Helles Gelb */
.alert-warning {
  background-color: #fff8e1;
  border-left-color: #ffc107;
  color: #664d03;
}

/* Alert Success – Sanftes Grün */
.alert-success {
  background-color: #e9f7ef;
  border-left-color: #198754;
  color: #0f5132;
}

/* Alert Light – Sehr helles Grau */
.alert-light {
  background-color: #f8f9fa;
  border-left-color: #ced4da;
  color: #636c72;
}

/* Alert Dark – Edles Anthrazit */
.alert-dark {
  background-color: #e2e3e5;
  border-left-color: #343a40;
  color: #212529;
}

/* Optional: Absätze und Listen einrücken */
.alert p,
.alert ul,
.alert div,
.alert span {
  margin-bottom: 0.5rem;
}

/* Optional: Links im Alert */
.alert a {
  font-weight: 500;
  text-decoration: underline;
  color: inherit;
}
.alert a:hover {
  text-decoration: none;
}


.text-info {
  color: #2074b6 !important;
}




.helper-box {
  background-color: #eaf6ff;
  border-left: 5px solid #0d6efd;
  padding: 1rem 1.25rem;
  border-radius: 0.5rem;
  font-size: 0.95rem;
  color: #084298;
  margin-top: 0.75rem;
}



.col-form-label {
  padding-top: calc(1rem + 1px);
  padding-bottom: calc(1rem + 1px);
  margin-bottom: 0;
  font-size: inherit;
  line-height: 1.5;
  font-weight: 500; /* Bootstrap 5: entspricht fw-semibold */
  color: #212529; /* leicht dunkler als Standard-Grau */	
}


.input-group-text {
  background-color: #f0f4f8;        /* helles, modernes Grau-Blau */
  color: #495057;                   /* angenehmes Dunkelgrau */
  font-weight: 500;                 /* leicht betont */
  border: 1px solid #ced4da;
  border-radius: 0.5rem 0 0 0.5rem; /* links rund, rechts nicht */
  padding: 0.5rem 0.75rem;
  min-width: 3.5rem;                /* gleichmäßige Breite für Zahlen */
  text-align: center;
}

/* Einheitlicher Stil für Inputs */
input.form-control,
select.form-select,
textarea.form-control {
  border-radius: 0 0.5rem 0.5rem 0; /* rechts rund, links eckig – bei Input-Gruppen */
  border: 1px solid #ced4da;
  padding: 0.5rem 0.75rem;
  font-size: 1rem;
  box-shadow: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

/* Wenn nicht in Input-Group: komplett rund */
input.form-control:not(.border-start-0),
select.form-select:not(.border-start-0),
textarea.form-control:not(.border-start-0) {
  border-radius: 0.5rem;
}

/* Optional: Fokus-Stil modernisieren */
input.form-control:focus,
select.form-select:focus,
textarea.form-control:focus {
  border-color: #86b7fe;
  box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.1);
}



/* entfernt die Abrundung an der linken Seite des ersten Input-Group-Elements */
.input-group .input-group-text:first-child {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

/* falls Dein Input selbst noch Eckchen an der linken Seite hätte (normalerweise nicht),
   würde dieser folgende Code sie auch entfernen: */
.input-group input.form-control {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.input-group .input-group-text:first-child {
  border-radius: .5rem 0 0 .5rem;
}