

.footer-design {    
   background-color: #737373;
   color: #FEFBEA;
   line-height:18px;
   width: 100%;
}

.formdesign  {    
   background-color: #d4edda;   
   color: #000000;  
   border-color: #000000;  
}

.ShopBGColor  {    
   background-color: #c8eacd;
}
/*--    AB hier RUhrMusikschulen   ----------------     	background: url("img/Staedte.png") no-repeat top center fixed;  */
body {    
   background-color: #f2fcf2; 
   background-color: #FEFBEA;   /* buttery white  */
   background-color: #fff;
   background-color: #f8fcfe !important;
   font-family: 'Roboto', sans-serif;     /*  Quicksand Roboto Maven+Pro' */
      font-weight: 400;
      font-size: 1.0em;  /*  am 5.10.24 auf Roboto und von 1 auf 1.1  */
      line-height:1.2em;    
}


/* Transparentes Menü */
.navbar-transparent {
    background-color: rgba(0, 0, 0, 0.05); /* Halbdurchsichtiges Schwarz */
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 10; /* Überlagert den Header */
}
.navbar a {
    color: #ffffff !important; /* Weißer Text */
}
.navbar a:hover {
    color: LightBlue !important; /* Gelber Hover-Effekt ffcc00 F0F8FF  */
}









.bg_event-rows {    
   background-color: #fEfdff;  /* fffBdA */
}

/* Anpassungen der Bootstrap-Standard Einstellungen  */
.alert-success {    
   background-color: #F0F8FF;  /* AliceBlue */
   opacity: 0.9;
   color: #000;
}


.alert-light {    
   background-color: #F0F8FF;  /* AliceBlue   opacity:0.2;  */
  font-family: 'Roboto', sans-serif;    
   color: #000;
     line-height:1.2em;
     font-size: 1em;
}

.btn-primary{
   background-color: #6495ED;  /* CornflowerBlue Cerulean(Taubengrau): #9BB7D4*/
   background-color: #00BFFF;  /* DeepSkyBlue: #00BFFF */   
}

.border-secondary {
   background-color: #E0FFFF;  /* LightCyan */
   background-color: #dcdcdc;  /* LightCyan */
}
.card-body {
   background-color: #6495ED;  /* CornflowerBlue Cerulean(Taubengrau): #9BB7D4*/
   background-color: #9BB7D4 !important;  /* CornflowerBlue Cerulean(Taubengrau): #9BB7D4*/   
   background-color: #B0E0E6 !important;  /* PowderBlue (blassblau): #9BB7D4*/   
}

.card-body_ausstellung {
   background-color: #6495ED;  /* CornflowerBlue Cerulean(Taubengrau): #9BB7D4*/
   background-color: #9BB7D4 !important;  /* CornflowerBlue Cerulean(Taubengrau): #9BB7D4*/   
   background-color: #B0E0E6 !important;  /* PowderBlue (blassblau): #9BB7D4*/  
   background-color: #fff !important;  /* PowderBlue (blassblau): #9BB7D4*/  
}   
   
.eventtitel {
   color: #2E4C97;  /* Titel-Farbe: Sapphire  */
   font-weight: 900;
   font-size: 2.2em;
   line-height: 1.2em;
   padding-bottom:15px;
   
}



.bild_container {
  position: relative;
}

.centertext1 {	
  position: absolute;
  top: 80%;
  left: 42%;
  transform: translate(-35%, -60%);
  font-size: 2vw;
  font-weight: bold;
  color: #FEFBEA;
}

.centertext2 {
  position: absolute;
  top: 68%;
  left: 40%;
  transform: translate(-35%, -50%);
  font-size: 7vw;
  font-weight: bold;
  color: #FEFBEA;
}

#player {
    border-radius:4px;
       background-color: #ff0000; 
          background-color: #9BB7D4 !important;
          padding: 4px;
}

.card-body {
          background-color: #ffffff !important;

}

 /*  erste Zeile      */
.alert-info {   
/*   background-color: #ffffff;  /* AliceBlue */
/*   background-color: #A0DAA9;   Green Ash #A0DAA9 */      
/*    background-color: #ceefe4;  hummingbird */     
   background-image: linear-gradient( #9BB7D4, #e2e4e6) !important;
   background-image: linear-gradient( #d6f9ee, #f7fff7) !important;   
   color: #000;
   font-family: 'Roboto', sans-serif; 
}
 /*  zweite und dritte Zeile      */
.alert-warning {    
   background-color: #0072B5;  /* French Blue     */
   background-color: #78adc2;  /* French Blue     */   
   background-image: linear-gradient(to right, #78adc2, #a0d5ea) !important; 
  font-family: 'Roboto', sans-serif;    
   color: #fff;
     line-height:1.2em;
     font-size: 1em;
}

.kleingedrucktes  {
   background-color: #dedede;
   font-weight: 300;
   font-size: 0.8em;
   line-height: 1.1em;

}
/*  ALERT - definition Alerts erste Zeile */
.alert-titel  {
   font-weight: 600;
   font-size: 1.3em;
   line-height: 1.1em;
   margin-bottom: 15px;
  /* background-color: #e8e8e8; */
}
.alert-body  {
   font-weight: 400;
   font-size: 1.1em;
   line-height: 1.5em;
}
.borderfarbe{
	border-color: #A9A9A9 !important;
	border-color: #8cceea !important;  /* 8cceea anakiwa */
}

ul.a {
  list-style-type: circle;
}


.bg-primary{
   background-color: #6495ED;  /* CornflowerBlue Cerulean(Taubengrau): #9BB7D4*/
   background-color: #00BFFF !important;  /* DeepSkyBlue: #00BFFF */   
   background-color: #4169E1 !important;  /* RoyalBlue: #4169E1 */       
}

.bg_foerderverein{
   background-image: linear-gradient(to right, #78adc2, #a0d5ea) !important;     
}

/* unvisited link */
a:link {
  color: snowwhite !important;
  text-decoration: none;
}

/* visited link */
a:visited {
  color: snowwhite !important;
  text-decoration: none;
}

/* mouse over link #4169E1*/
a:hover {
  color: #8cceea !important;
  text-decoration: none;
}

/* selected link */
a:active {
  color: #8cceea;
  text-decoration: none;
}

.borderColor1:hover {
            border: 5px solid green !important;
}
        
ul {
   font-weight: 400;
   font-size: 1.0em;
   line-height: 1.3em;
}

.backBild {
background-image: url("img/phoenix.jpg");
}


/*  Phoenix-Bild */
/* Container holding the image and the text */
.container_ph {
  position: relative;
}
/* Bottom right text */
.text-block1 {
  position: absolute;
  bottom: 80px;
  right: 220px;
  background-color: white;  
  color: Black !important;
  padding-left: 40px;
  padding-right: 40px;
}

/*  Titel-Bild */
/* Container holding the image and the text */
.container_ti {
  position: relative;
}
/* Bottom right text */
.text-block_ti {
  position: absolute;
  top: 10%;
  left: 30%;
  background-color: black;
  transform: translate(-35%, -60%);
  color: white;
  padding-left: 20px;
  padding-right: 20px;
}


/*  Startblock - definition  */
.startblock-titel {
   font-weight: 800;
   font-size: 1.3em;
   line-height: 1.1em;
   margin-bottom: 0px;
  background-color: #dbe1e4;
}
.startblock-body  {
   font-weight: 400;
   font-size: 1.1em;
   line-height: 1.4em;
   text-align: left;
   padding-top: 15px;
   padding-bottom: 5px;
   background-image: linear-gradient(to right, #CCFFFF, #FFFFCC);
}

li  {
  font-weight: 600;
  margin-bottom: 6px;
}
li.b {
   font-weight: 400 !important;
   font-size: 1.0em! important;
   line-height: 1.3em !important;
   list-style-type: square;
}


/*  Modal  */

.border_modal  {
      background-image: linear-gradient( #d6f9ee, #f7fff7) !important;
}

/* Button-Styling für Positionierung */
#topButton {
 position: fixed;
 bottom: 20px;
 right: 20px;
 z-index: 1000;
 color: black;
 background-color: #dbe1e4;
 opacity: 0.6;
}

/*  Hamburger - Menü  */
.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(230, 230, 230, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

/* Animation für den Pfeil  beiCollapse */
.collapse-btn .rotate {
    transition: transform 0.2s ease;
}
.collapse.show + .btn .rotate {
    transform: rotate(180deg);
}

.btn-secondary  {
    background-color: #eeeeee  !important;
    color: #000000 !important;
}


/*    Accordion  */
.btn-basic  {
    background-color: #fff  !important;
    background-image: linear-gradient(to right, #CCFFFF, #FFFFCC);
    color: #333 !important;
}
.collapse_angebot {
    background-color: #FFFFee  !important;
  /*  background-image: linear-gradient(to right, #CCFFFF, #FFFFCC); */
    color: #333 !important;
    padding: 10px;
    border: 1px solid #CCFFFF;
    box-shadow: 1px 1px 35px #eee;
}


.footer-links {
  border: 0;
  padding-bottom: 1px;
  margin: 0px;
}




.accordion-button .arrow {
  display: inline-block;
  margin-right: 8px;
  width: 12px;
  height: 12px;
  border: solid black;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  transition: transform 0.3s ease;
}

.accordion-button.collapsed .arrow {
  transform: rotate(-135deg);
}