@charset "UTF-8";
/*!
 * Bootstrap v5.0.2 (https://getbootstrap.com/)
 * Copyright 2011-2021 The Bootstrap Authors
 * Copyright 2011-2021 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */

/*! ----------------------------------------- */
/*! Änderungen an Klassen template Cassiopeia */
/*!    
 */

/*! Klassen Testbereich template Cassiopeia */ 




/*! Klassen Testbereich template Ende */   

/*! Klasse Bestimmung Farbschema template Cassiopeia */
:root
{
/*! Farbschema template Logo Croon grün und grau */
/**  --cassiopeia-color-primary: #0F5230;  /** Hauptfarbe des Templates */
/**  --cassiopeia-color-link: #000000;     /** gibt die Farbe an, in der Links dargestellt werden */
/**  --cassiopeia-color-hover: #E8E8E8;    /** bestimmt die Farbe, mit der Links beim Überrollen mit der Maus reagieren, in Abhängigkeit der Hauptfarbe template */

/*! Farbschema template Logo Croon grün und hell grün */
  --cassiopeia-color-primary: #0F5230;  /** Hauptfarbe des Templates */
  --cassiopeia-color-link: #1B5B3B;     /** gibt die Farbe an, in der Links dargestellt werden */
  --cassiopeia-color-hover: #E4E4E4;    /** bestimmt die Farbe, mit der Links beim Überrollen mit der Maus reagieren, in Abhängigkeit der Hauptfarbe template */

}
   
/*! Klasse generell */
body
{ /** Seite angepaßt - Schriftgröße, Schriftdicke, Zeilenhöhe  */ 
 font-size: 0.95rem;
} 


/*! Anpassungen Position topbar */
.container-topbar
{ 
 background-color: #ffffff;
 position: relative;
 width: 100%;
 padding: 0px 50px 5px 15px;  /** top right bottom left - kein Rand Mobil **/
}

/*! Anpassungen Menü topbar */
.sfx-topbar-menu
{ /** Menü rechtsbündig -  */
 background-color: #0F482C;
 position: relative;
 top: 5px;
 float: right;
 display: inline;
 border-radius: 0px 0px 8px 8px;  /** obenlinks obenrechts untenrechts untenlinks **/
 margin: 20px;
}


/*! ----------------------------------------------- */
/*! Klasse: Header ( incl. Menü )                   */
/*!                                                 */
.header
{  /** Header angepaßt - z.B. statt Farbe ein Bild  */
 background-color: #ffffff;
 border: 0;
 border-bottom: 0px solid #848C94; 
  -webkit-border-radius: 5px; 
  -moz-border-radius: 5px; 
 border-radius: 0px 0px 5px 5px;  /** obenlinks obenrechts untenrechts untenlinks **/
  -webkit-box-shadow: 0 15px 0px rgba(0,0,0, .7); 
  -moz-box-shadow: 0 15px 0px rgba(0,0,0, .7); 
 box-shadow: 3px 8px 10px 0px rgba(0,0,0, .7); 
}

.container-header  
{ /** Menüpunkte mouseover anpassen */ 
 background-color: #1B5B3B; 
 background: url(../images/img_bg_header.webp) 100% 100%/cover local; 
 opacity: 0.95; /** background: halb-transparent; **/
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; /* IE8 */
 margin: 0px 0px 0px 0px; /** top right bottom left **/
 min-height: 280px;  
}

.container-header .navbar-brand img 
{ /** Logo/Bild Größe verkleinern */ 
 width: 14rem;
 border: 0;
  -webkit-border-radius: 10px; 
  -moz-border-radius: 10px; 
 border-radius: 10px 10px 10px 10px;  /** obenlinks obenrechts untenrechts untenlinks **/
  -webkit-box-shadow: 0 50px 0px rgba(0,0,0, .3); 
  -moz-box-shadow: 0 50px 0px rgba(0,0,0, .3); 
 box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.3);
 margin: 40px 0px 0px 0px;  /** top right bottom left **/
}

.container-header .navbar-brand a:hover img
{ /** Bildbehandlung Logo mouseover */       
 transform: scale(1.2);
 box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
} 

/*! Anpassungen Klasse Standardmenü */
.container-nav
{ /** Container Menü anpassen -  */
 background: #1B5B3B;
 
}


/*! Anpassungen Klasse Menü Header */  
.container-header .mod-menu     
{ /** Menüpunkte Text - Schriftgröße, Farbe */ 
 font-size: 1.3rem;
 font-weight: normal;
 color: #ffffff; 
}  

.container-header .mod-menu .nav-item > a:hover    
{ /** Menüpunkte - mouseover anpassen */ 
 color: #C1C1C1; 
}  

/*! Anpassungen Menü Metismenü/Hauptnavigation */
.metismenu.mod-menu .mm-collapse 
{ /** Hintergrund aufgeklappt angepaßt */ 
 background-color: #0F482C;   
 border-color: #0F482C;
  -webkit-border-radius: 10px; 
  -moz-border-radius: 10px; 
 border-radius: 2px 2px 10px 10px;  /** obenlinks obenrechts untenrechts untenlinks **/
}

.metismenu.mod-menu .metismenu-item.active > a, 
.metismenu.mod-menu .metismenu-item > a:hover, 
.metismenu.mod-menu .mm-collapse > li > a,
.metismenu.mod-menu .metismenu-item > button:hover 
{ /** Menü aufgeklappt - Menüpunkte */ 
 color: #ffffff;
}

.metismenu.mod-menu .metismenu-item>a:hover, 
.metismenu.mod-menu .mm-collapse>li>a:hover
{ /** Menüpunkte mouseover -  */ 
 background-color: #ffffff;
 color: #0F482C;
  border-color: #0E76AA;
  -webkit-border-radius: 10px; 
  -moz-border-radius: 10px; 
 border-radius: 10px 10px 10px 10px;  /** obenlinks obenrechts untenrechts untenlinks **/
 padding: 0px 10px 0px 10px; /** top right bottom left **/
}   

.metismenu.mod-menu .metismenu-item,
.metismenu.mod-menu .metismenu-item>a, .metismenu.mod-menu .metismenu-item>button, .metismenu.mod-menu .metismenu-item>span,
.metismenu.mod-menu .mm-collapse>li>a
{ /** Menülinks */
 padding-left: 10px; /** top right bottom left **/
 padding-right: 10px;
}
/*! ------------------------------------------------------------------------ */
/*! ------------------------------------------------------------------------ */ 


/*! Anpassungen Klasse card */ 
.card
{  /** card angepaßt - Rand/Border mit 3D Effekt  */ 
/*! border: 5px outset #dfe3e7; */
}


/*! Anpassungen Klasse Content/Beiträge */
.page-header
{  /** Überschrift mit unterer Abgrenzung  */ 
 border-bottom: 0.1rem outset #D6D5D3; 
 margin-bottom: 5px;  /** Abstand unten **/
}

.com-content-article__body, /** Content bzw. Artikel */
.blog-items                 /** Blogartikel */
{ /** Content mit Hintergrundfarbe, abgerundete Ecken, Schatten  */   
 /** background-color: #F3EADC; */
 border: 0px;
 padding: 20px 20px 10px 20px;  /** top right bottom left **/
 margin-bottom: 5px;  /** Abstand unten **/
}

.com-content-article__body a:hover, /** Content bzw. Artikel Links mouse over */
.blog-item a:hover                  /** Blogartikel Links mouse over */
{ /** Schriftfarbe  */   
 color: #0F5230;
} 

/*! Anpassungen Beiträge - Klasse Infohinweise Beiträge */
.container-component  
{   
 margin-bottom: 5px;  
}

.article-info-term
{ /** Anpassungen Artikelinformationen Überschrift - Schriftgröße */
 font-size: 0.65rem;
}

.article-info dd
{ /** Anpassungen Artikelinformationen - Schriftgröße */
 font-size: 0.95rem;
}

/*! Anpassungen Weiterlesen - Klasse readmore */
.readmore
{ /** Größe Box, Hintergrund  */ 

} 

/*! Anpassungen Überschriften */   
.h1, h1 
{ /** Überschriften - Beiträge ohne Verlinkung */       
 font-size: 1.08rem;
} 

.h2, h2 
{ /** Überschriften - Beiträge mit Verlinkung */       
 font-size: 1.06rem;
} 

.h3, h3 
{ /** Überschriften - Beiträge mit Verlinkung */       
 font-size: 1.02rem;
} 

.h4, h4 
{ /** Überschriften - Beiträge mit Verlinkung */       
 font-size: 1.00rem;
} 

.h5, h5 
{ /** Überschriften - Beiträge mit Verlinkung */       
 font-size: 0.90rem;
} 

.h6, h6 
{ /** Überschriften - Beiträge mit Verlinkung */       
 font-size: 0.80rem;
} 

/*! Anpassungen Link generell  */ 

a
{ /** Link generell - kein Unterstrich */ 
 text-decoration: underline;
}

a:hover
{ /** Link generell - bei mouseover */ 
 color: #0F5230;
 text-decoration: underline wavy;
}

/*! Anpassungen Klasse Suchfunktion */
.form-search input
{ /** Input Feld Suchfunktion angepaßt, Hintergrund - runde Ecken  */
 height: 22px;
 border: 1px;
 border-radius: 6px 6px 6px 6px;  /** obenlinks obenrechts untenrechts untenlinks **/
  -webkit-box-shadow: 0 20px 0px rgba(0,0,0, .3); 
  -moz-box-shadow: 0 20px 0px rgba(0,0,0, .3); 
 box-shadow: 250px 3px 50px 0px rgba(0,0,0,0.3);
 background: #ffffff;
 color: #000000;
 border-color: #6F353C;
  -webkit-border-radius: 6px; 
  -moz-border-radius: 6px; 
}


/*! Anpassungen Klasse Kontaktformular */
.com-contact__container 
{ /** Überschrift "Kontakt" anpassen  */
 background: url(../images/img_bg_contact.png) center center no-repeat;
 background: #ffffff;
 color: #000000;
}   

.com-contact__container h3
{ /** Überschrift "Kontakt" anpassen  */
 font-size: 0.8rem;
}   

.com-contact__info  
{ /** Info/Adressdaten Kontaktformular anpassen  */ 
 font-size: 0.7rem;
} 


/*! Anpassungen Position bottom-b */  
.container-bottom-b
{ /** Hintergrundbild Position bottam-b */  
 background: url(../images/img_bg_bottomb.jpg) 100% 100%/cover fixed; 
 margin: 10px 0px 0px 0px; /** top right bottom left **/
 min-height: 160px;
}

.bottom-b .card-body 
{ /** Anpassungen Container Position bottom-b  */
 border: 1px;
 border-color: #000000;
  -webkit-border-radius: 6px; 
  -moz-border-radius: 6px; 
 border-radius: 6px 6px 6px 6px;  /** obenlinks obenrechts untenrechts untenlinks **/
  -webkit-box-shadow: 0 10px 0px rgba(0,0,0, .3); 
  -moz-box-shadow: 0 10px 0px rgba(0,0,0, .3); 
 box-shadow: 10px 3px 10px 0px rgba(0,0,0,0.3);
}


/*! Anpassungen Klasse Footer */ 
.footer
{ /** Schrift Anpassungen */
 background: #648C78;
 font-size: 0.90rem;
}


.footer a
{ /** Schrift Links */
 background: #276345;
 font-weight: bold;
 color: #ffffff; 
 border-color: #000000;
  -webkit-border-radius: 6px; 
  -moz-border-radius: 6px; 
 border-radius: 6px 6px 6px 6px;  /** obenlinks obenrechts untenrechts untenlinks **/
 padding: 3px 5px 3px 5px;  /** top right bottom left **/
}

.footer a:hover
{ /** Schrift Links mouseover */
 color: #ffffff; 
 background: #648C78;
}

.footer .metismenu > li > a:hover,
.footer .mod-menu > li > a:hover,
.footer .metismenu > li > span:hover,
.footer .mod-menu > li > span:hover
{ /** metismenu Links im footer Bereich bei mouseover */
 background: #ffffff;
 color: #514C46; 
}


/*! ----------------------------------------- */
/*! Eigene Klassen für template Cassiopeia    */
/*!                                           */
 
/*! Modul-Klassen-Suffix - ohne Rahmen */
.sfx-rahmenlos
{        
 border: 0px;
 margin: 0px 0px 0px 0px; /** top right bottom left **/
 padding: 0px 0px 0px 0px;  /** top right bottom left **/
} 


/*! Erweiterung in index.php - Formatierung Copyright Hinweis */
.sfx-copyright
{ /** Schriftgröße Links angepasst */ 
 background: #276345;
 padding: 0px 0px 15px 20px; /** top right bottom left **/
 font-size: 0.65rem;
 color: #ffffff;
 text-decoration: none;
} 


/*! Modul-Klassen-Suffix - Modul Kontakt */
.sfx-kontakt 
{ /** Hintergrundbild Kontakt Modul*/       
 background: #ffffff;
 color: #000000;
}

.sfx-kontakt h2
{ /** Überschrift Modul */       
 background-color: #E4E4E4; 
}


/*! Modul-Klassen-Suffix - Modul Telefonberatung */
.sfx-beratung 
{ /** Hintergrundbild Kontakt Modul*/       
 background: #ffffff;
 color: #000000;
}

.sfx-beratung h2
{ /** Überschrift Modul */       
 background-color: #E4E4E4; 
}


/*! Modul-Klassen-Suffix - Modul Unser Service */
.sfx-service 
{ /** Service Modul */       
 background: #ffffff;
 color: #000000;
}

.sfx-service h2
{ /** Überschrift Modul */       
 background-color: #215A34; 
 color: #ffffff;
}


/*! Modul-Klassen-Suffix - Modul Reparatur */
.sfx-reparatur 
{ /** Hintergrundbild Reparatur Modul*/       
 background: #ffffff;
 color: #000000;
}

.sfx-reparatur h2
{ /** Überschrift Modul */       
 background-color: #215A34; 
 color: #ffffff;
}


/*! Modul-Klassen-Suffix - Modul Bewässerungsanlagen */
.sfx-bewaesserung 
{ /** Hintergrundbild Bewässerungsanlagen Modul*/       
 /** background: url(../images/img_bg_bewaesserung.jpg) 100% 100%/cover local; */
}

.sfx-bewaesserung h2
{ /** Überschrift Modul */       
 background-color: #215A34; 
 color: #ffffff;
}

/*! Modul-Klassen-Suffix - Modul Partner */
.sfx-partner 
{ /** Hintergrundbild Partner Modul*/       
 background: url(../images/img_bg_partner.png) right top no-repeat; 
 background-color: #ffffff; 
 color: #000000;
}

.sfx-partner h2
{ /** Überschrift Modul */       
 background-color: #E4E4E4; 
}