picture, img {
	width: 100%;
	height: auto;
}


.loop_colored {
	color: #1fa19a !important;
	

}
.loop_color {
transition: color 500ms;


}

.page-id-885 .container_projektslider .col_text h2 , .page-id-886 .container_projektslider .col_text h2 , .page-id-883 .container_projektslider .col_text h2 , .page-id-889 .container_projektslider .col_text h2  {
	display: none;
}


.page-template-smartlake-front .masthead .menu-text {
	color: #00aaa7 !important;
}
	.scroll-top.on {
	    border-radius: 200px;
}

#mobile_logo img {
	width: 150px;
    height: auto;
	margin-top: 25px;
}

#mobile_logo {
	margin-top: 0px;
	margin-bottom: 20px;
}

.projekt_text {
	    margin: 40px 0 0 0;
	    padding: 30px;
    border-radius: 10px;
	    -webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
	
	    margin: 40px 0 0 0;
    padding: 30px;
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    font-size: 20px;
    line-height: 1.5em;
    text-align: center;
    font-weight: 200;
	position: relative;
	transition: all 1s;
}

.projekt_text strong {
	
    font-weight: 500 !important;

}

.projekt_text:before {
	       content: "";
    background-image: url(https://www.smartlake.media/wp-content/uploads/2023/01/smart-icon.png);
    width: 40px;
    height: 46px;
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    left: -20px;
    top: -13px;
    z-index: 2;
	
}

.projekt_text:before   {
	  left: 0px;
}

.projekt_text:hover {

	background-color: #f8f8f8;
}

#frontpage_slider {
	border: 35px solid rgba(0,171,168,1);
	height: calc(100vw/2);
    max-height: 90vh;
	
	background-image: url(https://www.smartlake.media/wp-content/uploads/2023/01/bg-slider-scaled.jpg);
	    background-size: cover;
    background-position: center center;
}

#frontpage_slider li {

}

#frontpage_slider li .left_half {
	    
   padding: 0 40px 0px 50px;
    position: absolute;
    left: 0;
    top: 30%;
	
	

	
}

#frontpage_slider li .slider_inner {
		
	    width: 100vw;
    height: 100vh;
	    position: relative;
}

#frontpage_slider li .left_half h2 {
	    font-size: 120px;
    line-height: 1em;
    font-weight: 800;
    text-transform: uppercase;
    color: rgba(0,171,168,1);
	
}

#frontpage_slider li .left_half h3 {
	font-size: 20px;
    line-height: 1em;
    font-weight: 600;
    text-transform: uppercase;
    padding: 10px 10px 7px 0px;
    margin-left: 0px;
    color: rgb(0,171,168);
   letter-spacing: 1px;
	/*background: rgb(0,171,168);
background: linear-gradient(90deg, rgba(0,171,168,1) 0%, rgba(0,171,168,1) 24%, rgba(0,171,168,0) 100%);*/
	
	
	
    margin: 10px 0px 20px 0px;
	
}

#frontpage_slider li .left_half p {
	letter-spacing: 1px;
    font-size: 20px;
    line-height: 1.2em;
    font-weight: 400;
    text-transform: uppercase;
    padding: 10px 10px 7px 0px;
    /* margin-left: -50px; */
    color: #FFF;
    /* background-color: rgba(0,171,168,1); */
    margin: 0px 0px 0px 0px;
    color: #000;
	    max-width: 620px;

	
}

#frontpage_slider li .right_half {
	position: absolute;
    right: 30px;
    height: 100%;
    width: 50%;
    top: 0;
	
}

#frontpage_slider li .right_half div {
 z-index: 999;
    display: block;
    
	    border-radius: 2000px;
	   -webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
	transition: all 1s;
	
	    background-size: cover;
    background-position: center center;
	    z-index: 99;
	
	width: 260px;
    height: 260px;
	opacity: 0.4;
	  position: absolute;
	
	filter: saturate(0);
}

#frontpage_slider li .right_half .web_frame_1 {
	  
       right: 18%;
    top: 25%;
	z-index: 1;
	
   
}

#frontpage_slider li .right_half .web_frame_2 {
	  
   right: 48%;
    top: 20%;
		z-index: 2	
		
   
}

#frontpage_slider li .right_half .web_frame_3 {
	  
  right: 35%;
  top: 40%;
z-index: 3;
	
   
}

#frontpage_slider li .right_half  div:hover  {
	/*border-radius: 5px;*/
	
	/*width: 400px;
	height: 225px;*/
		
	filter: saturate(1);
	/*z-index:99;*/
	opacity: 1;
}

#frontpage_kunden {
	    background-color: #ebebeb;
   /* border-bottom: 3px solid #CCC;*/
}

#frontpage_kunden li {
	padding: 10px 20px 10px 20px;
}

.spezial_headline h2 {
font-size: 70px;
    line-height: .8em;
    text-transform: uppercase;
    color: #1fa19a;
    padding: 20px 20px 20px 0px;
}



/* PROJEKTE */

.container_projektslider {
	position: relative;
}
.container_projektslider .col_text {
	background: rgb(255,255,255);
background: linear-gradient(90deg, rgba(255,255,255,1) 0%,rgba(255,255,255,0.9) 40%,  rgba(255,255,255,0) 100%);
position: absolute;
    z-index: 1;
    width: 50%;
    height: 100%;
	
}
.container_projektslider .col_text h2 {

    font-size: 70px;
    line-height: .8em;
    text-transform: uppercase;
    color: #1fa19a;
    padding: 20px 20px 20px 0px;
}


.container_projektslider .projektslider img {
	width: 100%;
	}

.inner_projektslider {
	
}

.inner_projektslider .layer_desktop {
	position: relative;
	height: 430px;
}

.inner_projektslider .layer_desktop  .layer_1  {
	position: absolute;
    left: 47px;
    top: 16px;
    width: 436px;
    height: auto;
}

.inner_projektslider .layer_desktop  .layer_2 {
	position: absolute;
    left: 30px;
    top: 0;
    width: 470px;
    height: auto;
	z-index: 9;
}

.inner_projektslider .layer_desktop  .layer_3  {
	    position: absolute;
    right: 46px;
    bottom: 64px;
    width: 98px;
    height: auto;
    z-index: 10;
}

.inner_projektslider .layer_desktop  .layer_4 {
	position: absolute;
    right: 40px;
    bottom: 40px;
    width: 110px;
    height: auto;
    z-index: 11;
}

.inner_projektslider .layer_desktop .layer_5 {
    position: absolute;
    right: 40px;
    bottom: 40px;
    width: 300px;
    height: auto;
    z-index: 11;
    -webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 75%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 75%);
}

.inner_projektslider .layer_desktop  .layer_6 {
	position: absolute;
    left: 47px;
    top: 16px;
    width: 100%;
    height: auto;
}

.inner_projektslider .layer_desktop .layer_7 {
    position: absolute;
    left: 50%;
    bottom: 40px;
    width: 100px;
    height: auto;
	margin-right: -50px;
    z-index: 11;
    -webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 75%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 75%);
}

.col_fade_right {
	position: absolute;
    right: 0;
    top: 0;
    width: 90px;
    height: 100%;
    background: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(255,255,255,0) 0%,rgba(255,255,255,0.5) 50%, rgba(255,255,255,1) 100%);
    z-index: 9;

}
	.col_text:after {
		    content: "";
    background-image: url(https://www.smartlake.media/wp-content/uploads/2023/01/smart-icon-grey.png);
    width: 120px;
    height: 120px;
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    left: -30px;
    top: 0;
	z-index:-1;
		
	transition: left 2s;
	}

.container_projektslider:hover .col_text:after {
	 left: -50px;	
}
/* FRONTPAGE TEXT */


.sliding_text_frontpage h2 {
	font-size: 37px;
    line-height: 1.2em;
}

.sliding_text_frontpage em {
	font-style: normal;
}

/* FORM */

.form_frame .gform_wrapper  {
	    padding: 30px;
    border-radius: 10px;
	    -webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
}

.gform_footer  {
	text-align: center;
}

.gform_footer input {
	margin: 0;
} 

/* FOOTER */

#smartlake_footer h2 {
	font-weight: 100;
    font-size: 21px;
}


#smartlake_footer #menu-projekte, .widget.widget_nav_menu {
	margin: 0 !important;
	padding: 0 !important;
}

#smartlake_footer .footer_p p {
	font-size: 27px;
    font-weight: 100;
    line-height: 1.4em;
}

.footer .menu li, .footer .widget_pages li, .footer .custom-menu.dividers-on li, .footer .blogroll li, .footer .qts-lang-menu li {
   margin: 0;
    padding: 0;
    border-width: 0 !important;
}

#smartlake_footer img {
    -webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    border-radius: 5px;
    padding: 10px;
    max-width: 300px;
    background-color: #FFF;
}

/* PROJEKTWALL */

.container_projektwall {
	margin-bottom: 15px;
}

.container_projektwall ul{
	    display: flex;
    margin: 0 !important;
    padding: 0;
    flex-wrap: wrap;
	
}

.container_projektwall li {
	width: calc(100%/4);
	list-style: none;
	line-height: 0em;
}

.container_projektwall li a {
padding: 20px;
	-webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    border-radius: 5px;
	display: block;
	    margin: 30px 10px 0px 20px;
}

.container_projektwall li img {
	width: 100%;	
	border: 1px solid #CCC;
}


.gfield_consent_description {
	line-height: 1.1em !important;
}

#main .gform_wrapper textarea, .gform_wrapper .top_label .gfield_label {
	font-size: 19px !important;
    font-weight: 400 !important;
}

.gform_wrapper .ginput_complex label, .gform_wrapper .gfield_time_hour label, .gform_wrapper .gfield_time_minute label, .gform_wrapper .gfield_date_month label, .gform_wrapper .gfield_date_day label, .gform_wrapper .gfield_date_year label, .gform_wrapper .instruction {
	color: #000 !important;
}

#mobile-menu {
	     display: inline-block;
    flex-wrap: wrap;
}

#mobile-menu li {
	background-color: #1fa19a;
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 25%);
    margin: 3% 0 0 0;
    padding: 15px 10px 15px 10px;
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 25%);
    text-align: center;
    display: block;
    width: 37%;
    float: left;
    margin-right: 3%;

}

#mobile-menu li a {
	padding: 0;
    text-align: center;
}

#mobile-menu li i {
	color: #FFF;
	margin: auto !important;
	    font-size: 27px;
}



#mobile-menu li .menu-text {
	 color: #FFF; 
}

#mobile-menu li .menu-item-text {
	  text-align: center;
    width: 100%;
    padding-top: 10px;
}

.image_single_referenzen {
	-webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
	
	margin-bottom: 20px;
}


/* FAQ */

.smartlake_faq_element  {
	   
    background-color: #FFF;
    padding: 0 0 0px 0px;
    margin: 0 0 20px 0;
    border: 1px solid #1fa19a;

	
}

.smartlake_faq_element h3  {
	    font-size: 18px;
	color: #FFF;
	    margin: 0 0 0px 0;
    padding: 10px 10px 8px 10px;
	cursor: pointer;
	font-weight: 400;
	background-color:  #1fa19a;
	
	    line-height: 1.2em;
}

.smartlake_faq_element .smartlake_faq_element_content   {
	display: none;
	background-color: #FFF;
    margin: 0px 0px 0px 0px;
    font-size: 16px;
    line-height: 1.3em;
    padding: 20px;
   
	
}

/* FOOTER AI */

#footer_ai_bot {
		z-index:9999;
	border-radius: 200px;
    background-color: #00aaa7;
    width: 40px;
    height: 40px;
    position: fixed;
    left: 30px;
    bottom: 30px;
	cursor: pointer;
	text-align: center;
	-webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
}

#footer_ai_bot:hover {
	background-color: #333333;

}
#footer_ai_bot img {
	    width: 70%;
    margin: auto;
    padding-top: 6px;
}

#footer_ai_bot_frame {
	display: none;
	background-color: #FFF;
	position: fixed;
    left: 30px;
    bottom: 90px;
    -webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    border-radius: 10px;
    min-height: 10px;
    width: 410px;
    z-index: 9999;
    max-width: 80%;
	overflow: hidden;
	padding: 30px;
	overflow-y: scroll;
    overflow-x: hidden;
	max-height: 80vh;
}



#footer_ai_bot_iframe {
	border-radius: 200px;
    background-color: #00aaa7;
    width: 40px;
    height: 40px;
    position: absolute;
        left: 9px;
    top: 10px;
	
	text-align: center;
	-webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
}
#footer_ai_bot_iframe img  {
	 width: 70%;
    margin: auto;
    padding-top: 6px;
}


	
	#chat_board  ul {
	margin: 0;
    padding: 0;
	}
	
	#chat_board  ul li {
		font-weight: 500;
    line-height: 1.4em;
		list-style: none;
		padding: 30px;
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 25%);
	}
	
	#chat_board  li.bot_msg {
		    background-color: #00aaa7;
		color: #FFF;
    padding: 20px;
    margin-bottom: 20px;
		position: relative;
	}

.ai_terms  {
	    display: flex;
    gap: 2px;
    flex-wrap: wrap;
    font-weight: 600;
}


.bot_info span  {
	    display: block;
    
    background-color: #FFF;
    border-radius: 5px;
    padding: 10px 10px 10px 10px;
    margin: 10px 10px 0px 0px;
    line-height: 1em;
}

.bot_info a {
	    display: block;
   
    background-color: #FFF;
    border-radius: 5px;
    padding: 10px 10px 10px 10px;
    margin: 10px 10px 0px 0px;
    line-height: 1em;
}


#chat_board  li.bot_msg:before {
	content: "";
    background-image: url(https://www.smartlake.media/wp-content/uploads/2023/08/icons8-chatbot.svg);
    z-index: 9999;
    border-radius: 200px;
    background-color: #009635;
    width: 20px;
    height: 20px;
    position: absolute;
    left: -8px;
    top: -8px;
    cursor: pointer;
    text-align: center;
    -webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    background-position: center center;
    background-size: 80% auto;
    background-repeat: no-repeat;
}
	
	#chat_board  li.bot_info {
		    background-color: #e5c1e2;
		color: #000;
    padding: 20px;
    margin-bottom: 20px;
	}
	
	#chat_board  li.user_msg {
		    background-color: #FFF;
    padding: 20px;
    margin-bottom: 20px;
		font-weight: 700;
    color: #000;
	}
	
	#chat_board  input,  #chat_board  button {
		
		       padding: 2%;
    font-size: 17px;
    border-radius: 6px;
    /* -webkit-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 25%); */
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
    /* box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 25%); */
    border: 1px solid #CCC;
	}
	
	#chat_board  button {
		cursor: pointer;
    background-color: #00aaa7;
    color: #FFF;
    font-weight: 600;
	}

#chat_board li.contact_msg {
	 background-color: #00aaa7;
	color: #FFF;
	font-size: 20px;
    padding: 20px;
    margin-bottom: 20px;
}

#chat_board li.contact_msg a {
color: #FFF;	
	
}

#ai_spinner {
	margin-top: 7px;
    display: block;
    float: right;
	display: none;
}
	
	#chat_board  button:hover {
		background-color: #CCC;
		 color: #00aaa7;
	}
	
	#chat_board .new_question {
		    color: #000;
    padding: 2%;
    font-size: 17px;
    border-radius: 6px;
    /* -webkit-box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 25%); */
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25);
    /* box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 25%); */
    /* border: 1px solid #CCC; */
    margin-bottom: 20px;
    display: block;
    text-decoration: none;
    background-color: #00aaa7;
    color: #FFF;
    font-weight: 600;
    text-align: center;
	}
	
	#chat_board {
		/*background-color: #FFF;
		max-width: 600px;
		margin-left: auto;
		margin-right: auto;
		padding: 30px;
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);*/
	}


/* INFOBOX */

.smartlake_infobox_element  {
	padding: 30px;
    border-radius: 10px;
    -webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
	
	background-color: #FFF;
	margin-bottom: 35px;
	
}

.smartlake_infobox_element p  {
	font-weight: 400;
    color: #000;
}

.smartlake_infobox_element h3  {
	font-weight: 500;
	    color: #1fa19a;
}

/* WARTUNG */

#wartung_contact {
	font-size: 20px;
    margin: 0 0 40px 0px;
}

.wartungen {
    -webkit-box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    -moz-box-shadow: 0px 0px 21px 0px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 21px 0px rgb(0 0 0 / 25%);
    border-radius: 5px;
    padding: 30px;
    max-width: 750px;
	margin: auto;
    background-color: #FFF;
}

#wartung_status #status_aktiv {
	   
    color: #FFF;
    font-weight: 700;
    text-align: center;
    display: inline-block;
    padding: 2px 16px 2px 16px;
    border-radius: 4px;
    margin: 0 0 0 5px;
}


#wartung_status #status_aktiv {
    display: inline-block;
    
    border-radius: 20px;
    font-size: 14px;
    font-weight: bold;
    color: white;
    background: linear-gradient(
        270deg, 
        #00c853, 
        #64dd17, 
        #00c853
    );
    background-size: 400% 400%;
    animation: gradientMove 5s ease infinite;
    box-shadow: 0 3px 8px rgba(0, 200, 83, 0.4);
    text-transform: uppercase;
}

#wartung_status #status_inaktiv {
	   
    color: #FFF;
    font-weight: 700;
    text-align: center;
    display: inline-block;
    padding: 2px 16px 2px 16px;
    border-radius: 4px;
    margin: 0 0 0 5px;
}


#wartung_status #status_inaktiv {
    display: inline-block;
    
    border-radius: 20px;
    font-size: 14px;
    font-weight: bold;
    color: white;
    background: linear-gradient(
        270deg, 
        #bf4136, 
        #a6271c, 
        #911c11
    );
    background-size: 400% 400%;
    animation: gradientMove 5s ease infinite;
    box-shadow: 0 3px 8px rgba(145, 28, 17, 0.4);
    text-transform: uppercase;
}

@keyframes gradientMove {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.wartung_space {
	height: 20px;
}

#wartung_basis {
	list-style: none;
	margin: 0;
    padding: 0;
}

#wartung_basis li {
	background: #f9f9f9;
    margin: 6px 0;
    padding: 10px 14px;
    border-radius: 6px;
    border: 1px solid #e0e0e0;
    font-size: 15px;
    line-height: 1.4;
    color: #333;
    transition: all 0.2s ease-in-out;
}


#wartung_basis {
	
}


#wartung_archiv {
	list-style: none;
	margin: 0;
    padding: 0;
}

#wartung_archiv li {
	    background: #f9f9f9;
    margin: 6px 0;
    padding: 10px 14px;
    border-radius: 6px;
    border: 1px solid #e0e0e0;
    font-size: 15px;
    line-height: 1.4;
    color: #333;
    transition: all 0.2s ease-in-out;
}


#wartung_archiv {
	
}

#kundennr_archiv {
	list-style: none;
	margin: 0;
    padding: 0;
}

#kundennr_archiv li {
	    background: #f9f9f9;
    margin: 6px 0;
    padding: 10px 14px;
    border-radius: 6px;
    border: 1px solid #e0e0e0;
    font-size: 15px;
    line-height: 1.4;
    color: #333;
    transition: all 0.2s ease-in-out;
}


#kundennr_archiv  a{
	text-decoration: none;
	font-weight: 900;
}



ul.list_extensions {
    list-style: none !important; /* Standardpunkte entfernen */
    margin: 0 !important;
    padding: 0;
}

ul.list_extensions li {
    background: #f9f9f9;
    margin: 6px 0;
    padding: 10px 14px;
    border-radius: 6px;
    border: 1px solid #e0e0e0;
    font-size: 15px;
    line-height: 1.4;
    color: #333;
    transition: all 0.2s ease-in-out;
}
/*
ul.list_extensions li:hover {
    background: #00aaa7;
    border-color: #00aaa7;
	color: #FFF;
    transform: translateX(0px);
}*/

.btn_wartung_wrapper {
	display: flex
;
    gap: 1%;
    flex-wrap: wrap;
}

.btn_wartung {
	    background: var(--the7-links-color);
    margin: 10px 0px;
    padding: 10px 14px;
    border-radius: 6px;
   width: calc(82% / 3);
    font-size: 15px;
    line-height: 1.4;
    color: #FFF;
    transition: all 0.2s ease-in-out;
   
    display: block;
    text-align: center;
    font-weight: 900;
    text-decoration: none;
}

.btn_wartung:hover {
	background-color: #000;
}

#wartungen_loop_wrapper {
	    display: flex;
    flex-wrap: wrap;
       margin-left: -10px;
    margin-right: -10px;
}

.wartungen.loop {
	margin: 10px;
}

.wartungen.loop.stop {
	outline: 5px solid red;
	position: relative;
}
.wartung-diesen-monat .wartungen.loop {
	outline: 5px solid green;
	
}

.wartungen.loop.stop:before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	background-color: rgba(255,255,255,0.5);
	width: 100%;
    height: 100%;
} 

.loop_wrapper {
	width: calc(100%/2);
	
}

.monatsauswahl {
    list-style: none !important;
    margin: 0 0 80px 0px !important;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 8px;
    font-family: system-ui, sans-serif;
}

.monatsauswahl li a {
    display: block;
    padding: 12px 18px;
    border-radius: 6px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    color: #FFF;
    background: linear-gradient(145deg, #00aaa7, #187876);
    
    
    transition: all 0.2s ease-in-out;
	line-height: 1em;
	text-align:center;
}

.monatsauswahl li a:hover {
    background: linear-gradient(145deg, #187876, #0a3b3a);
    border-color: #00aaa7;
    transform: translateY(-2px);
    
}

/* Aktueller Monat hervorheben */
.monatsauswahl li.current-month a {
    background: linear-gradient(270deg, #10b981, #34d399, #10b981);
    background-size: 300% 300%;
    animation: gradientShift 6s ease infinite;
    color: white;
    border: none;
    
}

@keyframes gradientShift {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}


/* Ausgewählter Monat */
.monatsauswahl li.selected-month a {
    background: #fef3c7;
    border-color: #fbbf24;
    color: #92400e;
    
    font-weight: 600;
	    
}

.monatsauswahl li.all-entrys a {
    background: #f0f0f0;
    
    color: #000;
    
    font-weight: 600;
	    
}

/* Falls es gleichzeitig aktueller Monat ist → beide Effekte */
.monatsauswahl li.current-month.selected-month a {
    background: linear-gradient(270deg, #f59e0b, #fbbf24, #f59e0b);
    color: white;
    border: none;
}

.archive-tags { display:flex; flex-wrap:wrap; gap:6px; margin:8px 0; }
.badge { display:inline-flex; align-items:center; padding:4px 8px; font-size:12px; font-weight:600; border-radius:5px; border:1px solid transparent; }
.badge-wartung  { color:#065f46; background:#ecfdf5; border-color:#a7f3d0; }
.badge-todo { color:#7c2d12; background:#fff7ed; border-color:#fed7aa; }
.badge-rechnung  { color:#FFF; background:#f54272; border-color:#703d4a; }

.incoming {
	 color: white !important;
    background: linear-gradient(270deg, #00c853, #64dd17, #00c853) !important;
    background-size: 400% 400% !important;
    animation: gradientMove 5s ease infinite;
}

.form_wartungen {
  max-width: 500px;
  margin: 2rem auto;
  padding: 1.5rem;
  background: linear-gradient(135deg, #f9f9f9, #ffffff);
  border: 1px solid #e2e2e2;
  border-radius: 5px;
  box-shadow: 0 6px 16px rgba(0,0,0,0.08);
  display: flex;
  flex-direction: column;
  gap: 1rem;
  
}

.wartungsblock textarea, 
.wartungsblock button {
	width: 100%;
	}

.wartungsblock button {
	margin-bottom: 10px;
}

.form_wartungen textarea {
  min-height: 120px;
  padding: 1rem;
  border-radius: 5px;
  border: 1px solid #ccc;
  resize: vertical;
  font-size: 1rem;
  line-height: 1.4;
  transition: all 0.2s ease-in-out;
  color: #000;
}

.form_wartungen textarea:focus {
  border-color: #4cafef;
  box-shadow: 0 0 8px rgba(76,175,239,0.3);
  outline: none;
}

.form_wartungen button {
  padding: 0.8rem 1.2rem;
  font-size: 1rem;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  background: linear-gradient(270deg, #00c853, #64dd17, #00c853) !important;
  color: #fff;
  font-weight: bold;
  letter-spacing: 0.5px;
  transition: all 0.2s ease-in-out;
}

.form_wartungen button:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 12px rgba(0,0,0,0.15);
}

.form_wartungen button:active {
  transform: translateY(0);
  box-shadow: 0 3px 6px rgba(0,0,0,0.2);
}

.content_wartung {
	
	display: block;
    padding: 12px 18px;
    border-radius: 6px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    color: #FFF;
    background: linear-gradient(145deg, #00aaa7, #187876);
    border: 1px solid #00aaa7;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    
    line-height: 1.1em;
   
margin-bottom: 20px;
   
    font-weight: 600;
}


.accordion {
    
     
      margin-bottom: 20px;
      overflow: hidden;
    }

    .accordion-header {
    
    cursor: pointer;
    background: #f0f0f0;
    margin: 10px 0px;
    padding: 10px 14px;
    border-radius: 6px;
    border: 1px solid #e0e0e0;
    font-size: 15px;
    line-height: 1.4;
    color: #000;
    transition: all 0.2s ease-in-out;
    /* width: 100%; */
    display: block;
    text-align: center;
    font-weight: 900;
   
    }

    .accordion-content {
      display: none;
   
    }

    /* Optional: aktiver Zustand */
    .accordion-header.active {
     
    }

#calendar_wrapper{
	display: flex;
	gap: 20px;
}

.backup-calendar {
  width: 90px;          /* kompakt */
  border: 2px solid #ccc;
  border-radius: 6px;
  overflow: hidden;
  font-family: sans-serif;
  text-align: center;
	margin-top: 50px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.bc-header {
  background-color: #00aaa7;  /* oben Balken */
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  padding: 4px 0;
}

.bc-body {
  background: #fff;
  padding: 6px 0;
}

.bc-days {
  display: block;
  font-size: 20px;
  font-weight: bold;
  color: #111;
  line-height: 1.2;
}

.bc-unit {
  display: block;
  font-size: 12px;
  color: #555;
}


 #wartung-info {
    margin-top: 20px;
	 margin-bottom: 20px;
    padding: 16px;
    border-radius: 5px;
    background: #f8f9fa;
  /*  box-shadow: 0 8px 24px rgba(0, 0, 0, .08);*/
    
    font-family: sans-serif;
  }

  #wartung-text {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 10px;
    text-align: center;
  }

  .progress {
    width: 100%;
    background: #f3f4f6; /* hellgrau */
    border-radius: 10px;
    overflow: hidden;
    height: 18px;
  }

  .progress-bar {
    height: 100%;
    width: 0;
    background: linear-gradient(90deg, #48bb78, #38a169); /* grün */
    transition: width 0.6s ease;
  }