/* >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>    user.css  cassiopeia_carmen   <<<<<<< */ 
 																										
@charset "utf-8";

*    { margin: 0px; padding: 0px; border: none; }

html  { height:100%;}



/* ##############     fonts     #####################################*/

@font-face {
	font-family: LinBiolinum;
	src: url('../fonts/LinBiolinum_R.otf');
}

@font-face {
	font-family: Chilanka;
	src: url('../fonts/Chilanka-Regular.ttf');
}

@font-face {
	font-family: Hobo;
	src: url('../fonts/HoboStd.otf');
}




/* ##############     links     ######################################*/

/* grundsätzlich vorhandene weiße Linie im Menü (unter der Unterstreichung) entfernen */
.container-header .metismenu > li.active > a::after,
.container-header .metismenu > li.active > button::before,
.container-header .metismenu > li > a:hover::after,
.container-header .metismenu > li > button:hover::before {
  background: none;   /*#fff;*/
  border:  none;
  left: 0;
  right: 0;
}


a {
	color: black !important;
}

a:hover,
a:focus {
  text-decoration: underline;
  color: black;
		/*  color: #8e4613 !important;
		  text-decoration: none !important;*/
}

li.current.active a{
  text-decoration: underline;
  color: black;
		/*  color: #8e4613 !important;
		  text-decoration: none !important;*/
}




/* ##############  Text   Formatierungen   ############################*/


h1 {font-size:1.5em;	line-height: 2.2em; }
h2 {font-size:1.5em;	line-height: 2.2em; }
/*h3 {font-size:1.3em;	margin-bottom: 1em; }*/
h3 {font-size:1.4em;	margin-bottom: 1em;  font-weight: bold; color: #5f1619;   /* grün: #39701d; */}
h4 {font-size:1.1em;	margin-bottom: 1em;  color: #5f1619;}
h5 {font-size: 1em;   margin-bottom: .5em; margin-top: 1.5em; font-weight: bold; color: #5f1619; }
/*.hobo-weiss {font-size: 2.1em; letter-spacing: 0.1em; font-family: Hobo;}
  .header2 {font-size: 1.5em; color: white; line-height: 1.3em; text-align: center;}
*/


p {margin-bottom: 15px;	line-height: 21px;	list-style-type: none;	}

.sonder {font-family: Chilanka; font-size: 1.3em; font-weight: bold; color: #5f1619; 
	text-align: center; line-height: 1.5em;	margin-top: 1.2em;	margin-bottom: 1.2em;	}
.sonder-left {font-family: Chilanka; font-size: 1.3em; font-weight: bold; color: #5f1619; 
	line-height: 1.5em;	margin-top: 1.2em;	margin-bottom: 1.2em;	}
.sonder1 {font-family: Chilanka; font-size: 1.3em; font-weight: bold; color: #5f1619; 
	line-height: 1.5em;	margin-left: 2em;   margin-top: 1.2em;	margin-bottom: 1.2em;	}
.fogal {margin-top: 1em;font-weight: bold; font-size: 1.3em;}
.big 	{font-size:  2em;	}
.bold {font-weight: bold;	}
.ab-oben-1 { margin-top: 1.5em;}
.ab-oben-2 { margin-top: 2em; }
.ab-oben-3 { margin-top: 2.5em; }
.ab-oben-4 { margin-top: 4em; }
.ab-left 	 { margin-left: 1em; }
.hoch 	{	margin-top: -1.3em !important;}
.under 	{	text-decoration: underline;}
.center {	text-align: center;}




/* ##############  buttons  ############*/


/*weiterlesen*/     /* nur "weiterlesen ..."  anzeigen lassen:  Optionen/Beiträge -> Weiterlesen-Titel: verbergen */
a.btn-secondary {
	border-radius: 10px;
	background: #f0eded;
	padding: 5px 15px;
}

p.readmore {
	text-align: center;
}


/*zurück  -  nach Weiterlesen*/
.zurueck {
  padding: 10px;
  border: solid 1px lightgrey;
  border-radius: 15px;
  background: #f0eded;
  width: fit-content;
  margin: auto;
}


#back-top {     /* ist deaktiviert */
	background: transparent;
	position: relative;
	bottom: 150px;
	left: 96%;
	border-radius:13px;
	  box-shadow: 2px 3px 7px  #6f6f6f;
}





/* ##############     Seminar-Termine  pseudo-Tabelle    ######################################*/


#seminar-termine { 				/* ein div im Menüpunkt Seminare+Workshops */
	background: #f0eded;		/* der führende Beitrag */
	width: 80%;
	margin: auto;
	margin-top: 20px;
	padding: 15px 40px;
  	border-radius: 10px;
	  box-shadow: 2px 3px 7px  #6f6f6f;
} 


div.seminar-tab {display: flex; flex-direction: row;}
.s-inhalt {width: 20em; word-wrap: enabled}
.s-termin {margin-left: 0.5em;}

				/* bis 767  */              
				@media (max-width:767px) { 
					#seminar-termine { 
					   width: 100%;
					   padding: 5px;
					}
				}




/* ##############     images     ################################*/

/* JO image gallery*/
/*
.gallery-item {box-shadow: 2px 3px 7px  #6f6f6f;
}*/



/*  SIGE  */
.sigplus-gallery > ul > li {
	margin: 10px !important;
	border-radius: 5px;
		box-shadow: 2px 3px 7px  #6f6f6f;
}

							
.blogimg {
	width: 300px;
	height: 198px;
	margin: auto;
	margin-top: 1em!important;;
	border-radius: 8px;
	box-shadow: 2px 3px 7px  #6f6f6f;
}

.carmen13 {
	width: 200px;
	height: 150px;
	margin: 10px;
    /*border: solid 5px #b5b5b5;*/
	border-radius: 4px;
	box-shadow: 2px 3px 7px  #6f6f6f;
}

.carmen2 {
	width: 150px;
	height: 200px;
	margin: 10px;
    /*border: solid 5px #b5b5b5;*/
	border-radius: 4px;
	box-shadow: 2px 3px 7px  #6f6f6f;
}
						
.quer-img-right,
.hoch-img-right {
	width: 300px;
	float: right;
	margin: 1em 2em 2em 0.1em;
    /*border: solid 3px darkgrey;*/
    border-radius: 8px;
        box-shadow: 2px 3px 7px  #6f6f6f;
}


.hoch-img-left,
.quer-img-left {
	width: 300px;
	float: left;
	margin: 1em 2em 2em 2em;
	/*border: solid 3px darkgrey;*/
  	border-radius: 8px;
      box-shadow: 2px 3px 7px  #6f6f6f;
}


/* bis 767  */              
				@media (max-width:767px) { 

						figure.imgblog1, 
						figure.imgblog2,
						.imgblog1,
						.imgblog2 {
							width: 210px;
							height: 138px;
							}

						figure.imgtext {
							width: 350px;
							height: 153px;
						}
                    .quer-img-left,
                    .quer-img-right {
                        width: 280px;
                        margin: auto;
                        margin-bottom: 20px; 
                        margin-top: 20px;
                    }


                    .hoch-img-left,
                    .hoch-img-right {
                        margin: auto;
                        width: 180px;
                        margin-bottom: 20px; 
                        margin-top: 20px;
                    }

				} 

/*Aufbau*/---------------------------------------------------

/* 			header     															display: none;            			                     
					grid-child
						navbar-brand						
							link-brand-logo						

				site-grid
					container-banner full-width						BG  wasserfall-bild
							mod-custom110											header-texte
							mod-custom 107											logo
					grid-child container-component
							navbar   													main-menu
							main   														Inhalt
					#back-top
*/


/*	Wasserfall-Bild					BG in container-banner*/
/*  header-texte		112			position	banner */
/*  logo  					110			position  banner */
/*  main-menu					1  		position	main-top */
/*	footer-menu  		113 		position	main-bottom
/*	mycopyright			114 		position	main-bottom


/*
background: #fbf9f9;    /*fast weiß*
background: #ababab;		/*grau*
box-shadow: 2px 3px 7px  #6f6f6f;
*/



/* ##############   body  site-grid   #############################*/


html, body {
    padding: 0;
}


body.site {                 /*  BG  fast-weiß  */
    color: black;
    border-top: none !important;
    padding: 0 !important;
    background-color: #ededed;
	font-family: "Trebuchet MS",Geneva,sans serif;
    font-size: 15px;
    line-height: 19px;
    color: #000;   /*black*/
	border: none;
}


.site-grid {              /*  ganze Seite  */  
  	margin: auto;
  	padding: 0 !important;
	width: 900px;
	/*box-shadow: 2px 3px 7px  #6f6f6f;*/
	background: transparent; 
}


body.wrapper-fluid .site-grid {
	grid-gap: 0;   /* 0 2em */
}

header.header {
	display: none;
}




/* ##########   container-banner       position banner   #################*/

.container-banner {
  	background-image: url(/images/template-images/BGnew-06.jpg);   /*900x598px*/
	background-repeat: no-repeat;
	height: 598px;
	width: 900px;
  	margin: 0;
		border-radius: 13px;
		box-shadow: 2px 3px 7px  #6f6f6f;
}




/* header-texte    modul ID 107    position banner   ################ */

#mod-custom107 {       
    background-image: url(/images/template-images/header-img3.png);  /*750x160px*/	  
	background-repeat: no-repeat;
	height: 160px;
}

/*	header-img2.png 								
	header-img3.png 	750 x 160 px 		texte nebeneinander
	header-img6.png 	304 x 103 px  	texte übereinander
*/




/*  my-logo   modul ID 110   leonardo   position banner   #############*/

#mod-custom110 {   
	background-image: url(/images/template-images/logo.png);   /*196x193px*/
    margin-left: 780px;
	width: 196px;
	height: 193px;
	z-index: 1110;
}

/*
	logo.png  				196 x 193 px  
	logo-110.png   		110 x 108 px  
*/




/* ##############  .container-component     ###################*/

.container-component {
	margin-top: -277px;
	margin-left: 200px;
}




/* ##############   main-menu   ID 1   position main-top  #############*/

.main-top.card.main-menu-mod {
	background: transparent;
	border: none;
	padding: 0;
}

.card-body {
	padding: 0;
}


#main-menu {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	width: 900px;
  	margin: auto;
	margin-top: 0px;
	background: #fbf9f9;
	padding: 10px;
			border-radius: 14px;
			box-shadow: 2px 3px 7px #6f6f6f;
	z-index: 11;
}

#main-menu li {
	font-size: 1em;
	line-height: 1.3em;
}




/* ##############     main     ################################*/

main {
	/*border: solid 2px red;*/
  	margin: auto;
	margin-top: -10px !important;
	width: 900px;
	min-height: 200px;
	padding: 0 40px 40px 40px;
	background: #fbf9f9;
			border-radius: 14px;
			box-shadow: 2px 3px 7px #6f6f6f;
	z-index: 10;
}


.blog-item,
.category-desc {
	border-bottom: 2px black dotted;
	padding: 2em 1em !important;
}

.com-content-article.item-page {
	padding-top: 2em;
}




/* ##############  contact  ############*/

.com-contact.contact .page-header {
	margin-top: 1em;
}

label#jform_spacer-lbl {
	margin-top: 5px;
	margin-left: 20px;
}

label#jform_com_fields_ds_einwilligung-lbl {
	margin: 10px;
}

#jform_com_fields_ds_einwilligung {
	margin-left: 10px;
}

.btn.btn-primary.validate {
	margin-top: 20px;
	color: black;
	background: #f0eded;
	border: solid 1px lightgrey;
	border-radius:13px;
	  box-shadow: 2px 3px 7px  #6f6f6f;
}



/* ##############  Beitrag  Über mich  ############*/
									   
div.flex {               /* Text unter der Galerie */	
	display: flex;
	flex-direction: column;
}




/* ##############  position	main-bottom     footer-menu + copyright  ############*/

.main-bottom.card,
.main-bottom.card.footer-menu-mod,
.main-bottom.card.mycopyright {
	background: none;
	border: none;
	width: 900px;
}


#footer-menu {		
	margin-top: -15px;
  	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
	background: #fbf9f9;
	border-radius: 14px;
	padding: 8px;
	box-shadow: 2px 3px 7px #6f6f6f;
}





#mod-custom111 {        /*copyright*/  
	padding: 0;
	margin-top: -5px;
	margin-bottom:  10px;
	text-align: center;
  	font-size: 0.8em !important;
}





/* +++++++ @media  +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/*  mobile-stufen:   1346 	1144 	949 	767 	560 	 

/*ab 	1346		big screen*/

/*von 1144		bis 	1346  */
				@media (max-width:1346px) {  
							.container-component { margin-left: 100px }		
				}

/*von 949		bis 	1143  */
				@media (max-width:1143px) {  
							.container-component 	{ margin-left: 0px; }		
							#mod-custom107 				{ margin-left: 10px;}
					#mod-custom110      {margin-left: 700px;}
				}

/*von 768	bis 	948  */
				@media (max-width:948px) {  
					#mod-custom107 {  margin-left: 0px; }          /* header-texte */
					.site-grid {width: 100%; }
					.container-component {  /*border: solid 1px red;*/ margin-top: -250px;}

					#mod-custom110 {
						position: absolute;
						right: 207px; top: 190px;}					
					
					#main-menu {
           				flex-direction: column;
						width: fit-content;
						position: absolute;
						top: -180px;
						right: 20px;
					}


					
					main,
					.main-bottom.card,
					.main-bottom.card.footer-menu-mod,
					.main-bottom.card.mycopyright{
						/*border: solid 1px yellow;*/
						width: 100%;
						padding: 10px;
					}
				}


/*von 534	bis 767  */              /* 1080x1920 entspricht 360x640 */
				@media (max-width:767px) {  

				  #mod-custom107 {  /* header-texte */
						background-image: url(/images/template-images/header-img6.png);  /*750x160px*/	         
							background-repeat: no-repeat;	
						  top:20px; left: 20px;
					}          
					
				
					#mod-custom110 {   /* logo */
						position: absolute;  
							top:160px; right: 30px;
					}   

						.container-component 	{ 
								margin-top: -320px; 
						}


						button.navbar-toggler { 
							background: #110898a;
							margin: auto;
							position: relative;
			          		bottom: 50px;
				    		color:  white;
							background: grey;
				    		border: solid 2px white;
							padding: 10px;
								border-radius: 15px 2px;
								box-shadow: 2px 3px 7px black;
							z-index: 1111111;
						}		

						button.navbar-toggler:hover,
					  	button.navbar-toggler:focus {
							border-radius: 2px 15px;   /* umgedreht */
						}


						#main-menu {
							width: fit-content;
							flex-direction: column;
							position: absolute;
 				            top: -190px;
							right: 10px;
							z-index: 111111;
						}

	
						#footer-menu {
							flex-direction: column;
							text-align: center;
						}
				}	


/*von 356	bis 533  */              /* 1080x1920 entspricht 360x640 */
				@media (max-width:533px) {
						button.navbar-toggler { 
							margin-left: 20%;
						}
				}


/*von 0	bis 355  */              /* 1080x1920 entspricht 360x640 */
				@media (max-width:533px) {
						button.navbar-toggler { 
							margin-left: 10px;
						}
				}


/*  end ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */