/*!
 *  Prokopij.de Bootstrap4 HTML5 Responsive Template
 */
/* tests */
 
/* AS-2026: removed broken ..webfonts/gfonts.css import (font self-hosting pending — see ROLLOUT/Task 2). */

 /* Feder für Monitore */
 .feder {
	 width: 64px;
	 height: 289px;
	 position: relative;
	 float: right;
	 background-image: url(../images/feder.png); background-image: image-set(url(../images/feder.webp) type("image/webp"), url(../images/feder.png) type("image/png"));
	 background-size: contain;
	 background-repeat: no-repeat;
	 }

.nota {
		width: 84px;
		height: 289px;
		position: relative;
		float: right;
		background-image: url(../images/nota.png); background-image: image-set(url(../images/nota.webp) type("image/webp"), url(../images/nota.png) type("image/png"));
		background-size: contain;
		background-repeat: no-repeat;
		}
 
 .out {
	 
	 background-image: url(../images/blatt.png); background-image: image-set(url(../images/blatt.webp) type("image/webp"), url(../images/blatt.png) type("image/png"));
	 background-repeat: repeat-y;
	 z-index: -15px;
	 max-width: 978px;
	 
   }

.min-height-screen {
    min-height: 100vh;
}

.rechtsbuendig {
    text-align: right;
}

.mittig {
    text-align: center;
}
 
 .links {
	 background-image: url(../images/postit-gruen.png); background-image: image-set(url(../images/postit-gruen.webp) type("image/webp"), url(../images/postit-gruen.png) type("image/png"));
	 background-repeat: no-repeat;
	 width: 211px;
	 height: 600px;
	 position: relative;
	 float: left;
	 margin-left: 40px;
	 padding-top: 80px;
	 padding-left: 25px;
	 padding-right: 20px;
	 overflow: hidden;
   }

 .font80p {
	font-size: 80%;
   }

 
 .postitgelb {
	 width: 268px;
	 height: 184px;
	 position: relative;
	 top: 0px;
	 left: 20px;
	 /* right: 50px; 
	 z-index: 20; */
	 background-image: url(../images/postit-gelb.png); background-image: image-set(url(../images/postit-gelb.webp) type("image/webp"), url(../images/postit-gelb.png) type("image/png"));
	 background-repeat: no-repeat;
	 overflow: hidden;
	 padding-left: 30px;
	 padding-top: 25px;
   }
 /* 
 body {
   padding-top: 54px;
   font-family: 'Poppins', sans-serif;
   font-size: 14px;
   color: #4e3914;
   background-color:#fff7e9;
   background-color:rgba(240, 227, 204, 0.781);
 } */

 
 body {
	 background-color: #ffffff;
	 z-index: 10;
	 background-image: url(../images/holz-bg.jpg); background-image: image-set(url(../images/holz-bg.webp) type("image/webp"), url(../images/holz-bg.jpg) type("image/jpeg"));
 }
 
 p.btn-primary{
	 background-color: #533c00;
	 border-color: #533c00;
 }
 p.btn-primary:hover{
	 background-color: #725200;
	 border-color: #725200;
	 
 }
 a.btn-primary{
	 background-color: #906700;
	 border-color: #906700;
 }
 a.btn-primary:hover{
	 background-color: #725200;
	 border-color: #725200;
 }
 button.btn-primary{
	 background-color: #4eae3a;
	 border-color: #4eae3a;
 }
 button.btn-primary:hover{
	 background-color: #5ec549;
	 border-color: #5ec549;
 }
 
 a.btn-secondary{
	 background-color: #533c00;
	 border-color: #533c00;
	 /* AS: old : background: #3a7aae; */
 }
 /* AS: color changed for buttons in body */
 a.btn-secondary:hover{
	 background-color: #725200;
	 border-color: #725200;
	 /*AS: old value: 69a2d1*/
 }
 button.btn-secondary{
	 background-color: #4eae3a;
	 border-color: #4eae3a;
 }
 button.btn-secondary:hover{
	 background-color: #5ec549;
	 border-color: #5ec549;
 }
 
 .top-nav{
	 background-image: url(../images/menue-bg.png); background-image: image-set(url(../images/menue-bg.webp) type("image/webp"), url(../images/menue-bg.png) type("image/png"));
	 background-repeat:repeat;
	 background-position:center;
	 padding-left: 0%;
	 padding-right: 0%;
	 position: center;
	 
	 /*background-color:#fff9f2 !important;*/
 }
 .navbar-expand-lg.top-nav .navbar-nav .nav-link{
	 padding: 10px 15px;
	 font-size: 15px;
	 font-style: italic;
	 font-weight:600;
	 text-transform:none;
	 color: #235cb8;
	 
 }
 /* AS: color of the button, old 3a7aae*/
 .navbar-expand-lg.top-nav .navbar-nav .nav-link:hover{
	 background: #725200;
	 color: #ffffff;
	 border-radius: 4.8px;
 }
 .navbar-expand-lg.top-nav .navbar-nav .nav-link.active{
	 
	 color: #235cb8;
	 border-radius: 4.8px;
 }
 .navbar-expand-lg.top-nav .navbar-nav .dropdown-menu{
	 margin: 0px;
	 box-shadow: 3px 5px 15px rgba(0,0,0, .15);
	 border: none;
	 padding: 20px;
 }
 .navbar-expand-lg.top-nav .navbar-nav .dropdown-menu .dropdown-item{
	 font-size: 14px;
	 padding: 0px;
	 padding-bottom: 15px;
	 color: #235cb8;
	 font-style: italic;
	 font-weight:600;
 }
 .navbar-expand-lg.top-nav .navbar-nav .dropdown-menu .dropdown-item:last-child{
	 padding: 0px;
 }
 /* AS: color and size of the submenu items*/
 .navbar-expand-lg.top-nav .navbar-nav .dropdown-menu .dropdown-item:hover{
	 background: none;
	 color: #235cb8;
	 font-style: italic;
	 font-weight:600;
	 font-size: 1em;
	 /* old color 03306b*/
 }
 .top-nav .navbar-toggler{
	 color: #4e3914;
	 border-color: #4e3914;
 }
 .top-nav .navbar-toggler:hover{
	 color: #4eae3a;
	 border-color: #4eae3a;
 }
 
 .verweis-position{
 
	 display: block; 
	 position: relative; 
	 top: 3rem;
 }
 
 #myBtn {
	 display: none;
	 position: fixed;
	 bottom: 50px;
	 right: 30px;
	 z-index: 1099;
	 font-size: 18px;
	 border: none;
	 outline: none;
	 
	 background-color: rgba(170, 102, 25, 0.5);
	 color: white;
	 cursor: pointer;
	 padding: 15px;
	 border-radius: 4px;
   }
   
   #myBtn:hover {
	 background-color: rgba(202, 134, 46, 0.5);
   }
 
 /* Abschaltung von Bilderslider in der Hauptseite
 
 .slider-main .carousel .carousel-inner .carousel-item:before{
	 content: "";
	 position: absolute;
	 background: rgba(0, 0, 0, 0.239);
	 
	 top: 0px;
	 left: 0px;
	 width: 100%;
	 height: 100%;
 }
 
 .carousel-item {
   height: 20em;
   min-height: 300px;
   
   background: no-repeat center center scroll;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
   
 }
 */
 .carousel-item-as{
	 position:relative;
	 display:var(--card-margin);
	 -ms-flex-align:center;
	 align-items:center;
	 width:100%;
	 transition:-webkit-transform .6s ease;
	 transition:transform .6s ease;
	 transition:transform .6s ease,-webkit-transform .6s ease;
	 -webkit-backface-visibility:hidden;
	 backface-visibility:visible;
	 -webkit-perspective:500px;
	 perspective:500px}
 
 .portfolio-item {
   margin-bottom: 30px;
 }
 .services-bar h1{
	 font-weight: 600;
	 font-size: 24px;
 }
 .services-bar .card{
	 box-shadow: 3px 5px 15px rgba(0,0,0, .15);
	 border: none;
 }
 .services-bar .card h4.card-header{
	 background-color: #4e3914;
	 color: #4eae3a;
	 font-size: 18px;
	 font-weight: 400;
 }
 .services-bar .card .card-footer{
	 background-color: #4e3914;
 }
 
 
 .about-main{
	 padding: 30px 0px;
 }
 .about-main h2{
	 font-size: 24px;
	 font-weight: 600;
	 margin-bottom: 20px;
	 
 }
 .about-main h5{
	 font-size: 18px;
 }
 .about-main p{
	 font-size: 14px;
	 /* AS: disabled -> text-transform: capitalize; */
 }
 .about-main ul{
	 padding-left: 20px;
 }
 .about-main ul li{
	 position: relative;
	 font-weight: 300;
	 list-style: none;
	 line-height: 29px;
 }
 .about-main ul li:before{
	 content: "\f0da";
	 font-family: 'Font Awesome 5 Free';
	 font-weight: 900;	
	 position: absolute;
	 left: -15px;
	 top: 0px;
	 color: #4eae3a;
 }
 .portfolio-main{
	 padding: 30px 0px;
 }
 .portfolio-main h2{
	 font-weight: 600;
	 font-size: 24px;
	 margin-bottom: 20px;
 }
 .portfolio-main .card {
	 border: none;
	 border-radius: 4px;
	 overflow: hidden;
 }
 .portfolio-main .card .card-body .card-title{
	 margin-bottom: 0px;
	 
	 
 }
 .portfolio-main .card .card-body .card-title a{
	 font-size: 20px;
	 font-weight: 400;
	 text-transform: uppercase;
	 color: #4eae3a;
	 
 }
 .portfolio-main .card .card-body{
	 background: #4e3914;
	 padding: 10px 20px;
	 
 }
 .card-img{
	 overflow: hidden;
	 position: relative;
 }
 .overlay{
	 background: rgba(78,174,58,0.5);
	 position: absolute;
	 bottom: -100%;
	 width: 100%;
	 height: 100%;
	 left: 50%;
	 transform: translateX(-50%);
	 transition: all 0.3s;
 }
 .overlay i{
	 font-size: 35px;
	 position: absolute;
	 top: 50%;
	 left: 50%;
	 transform: translateX(-50%);
	 color: #4e3914;
 }
 .portfolio-main .card:hover .overlay{
	 bottom: 0px;
 }
 
 .footer { 
	 width:100%; 
	 background-color:#977235;
	 min-height:150px; 
	 padding:10px 0px 25px 0px;
	 }
 
 .bottom {
	 height: 55px;
	 background-image: url(../images/bg-unten.jpg); background-image: image-set(url(../images/bg-unten.webp) type("image/webp"), url(../images/bg-unten.jpg) type("image/jpeg"));
	 background-repeat: repeat-x;
	 color: #d3b281;
	 font-size: 11px;
	 text-align: center;
	 color: #d3b281;
	 font-size: 11px;
	 text-align: center;
	 background-color: #977235;
	 }
	 
 .pt2 { 
	 padding-top:40px ;
	 margin-bottom:20px ;
	 color: #ffffff;
	 font-weight: 500;
	 }
 footer p { 
	 font-size:14px; 
	 color:#CCC; 
	 padding-bottom:0px; 
	 margin-bottom:8px;
	 }
 .mb10 { 
	 padding-bottom:0px ;
	 }
 .footer_ul_amrc { 
	 margin:0px ; 
	 list-style-type:none ; 
	 font-size:14px; 
	 padding:0px 0px 10px 0px ; 
	 }
 .footer_ul_amrc li {
	 padding:0px 0px 5px 0px;
	 }
 .footer_ul_amrc li a{ 
	 color:#cccccc;
	 font-size: 14px;
	 font-weight: 300;
	 }
 .footer_ul_amrc li a:hover{ 
	 color:#fff; 
	 text-decoration:none;
	 }
 .footer_ul_amrc li .media-left{
	 margin-right: 10px;
 }
 .footer_ul_amrc li .media-left img{
	 max-width: 50px;
 }
 .footer_ul_amrc li .media-body p{
	 font-size: 14px;
	 font-weight: 500;
	 color: #ffffff;
 }
 .footer_ul_amrc li .media-body span{
	 color: #cccccc;
	 font-size: 14px;
	 font-weight: 400;
 }
 .fleft { 
	 float:left;
	 }
 .padding-right { 
	 padding-right:10px; 
	 }
 .footer_ul2_amrc {
	 margin:0px; 
	 list-style-type:none; 
	 padding:0px;
	 }
 .footer_ul2_amrc li p { 
	 display:table; 
	 }
 .footer_ul2_amrc li a:hover { 
	 text-decoration:none;
	 }
 .footer_ul2_amrc li i { 
	 margin-top:5px;
	 }
 .footer_ul2_amrc li a {
	 color: #4eae3a;
 }
 .bottom_border { 
	 border-bottom:1px solid #323f45; 
	 padding-bottom:20px;
	 }
 .foote_bottom_ul_amrc {
	 list-style-type:none;
	 padding:0px;
	 display:table;
	 margin-top: 10px;
	 margin-right: auto;
	 margin-bottom: 10px;
	 margin-left: auto;
 }
 .foote_bottom_ul_amrc li { 
	 display:inline;
	 }
 .foote_bottom_ul_amrc li a {
	 color:#ffffff; 
	 margin:0 12px;
	 font-size: 16px;
	 font-weight: 300;
	 }
 .footer-logo{
	 padding: 20px 0px;
	 text-align: center;
 }
 .copyright a{
	 color: #4eae3a;
	 text-decoration: underline;
 }
 .copyright a:hover{
	 color: #ffffff;
	 text-decoration: none;
 }
 .social_footer_ul { 
	 display:table; 
	 margin:15px auto 0 auto; 
	 list-style-type:none;
	 padding: 0;	
	 }
 .social_footer_ul li { 
	 padding-left:20px; 
	 padding-top:10px; 
	 float:left; 
	 }
 .social_footer_ul li a { 
	 color:#CCC; 
	 border:2px solid #CCC; 
	 padding:8px;
	 border-radius:50%;
	 }
 .social_footer_ul li i {  
	 width:20px; 
	 height:20px; 
	 text-align:center;
	 }
 .social_footer_ul li a:hover {
	 color: #4eae3a; 
	 border:2px solid #4eae3a; 
 }
 
 /* ---- All Pages CSS ---- */
 
 .as_text_bottom{
	 position: fixed;
	 bottom: -2em;
 }
 
 .full-title{
	 padding: 80px 0px;
	 /* AS: all-title-bg.jpg changed to slider-01.jpg*/
	 background: url(https://teremok-hamburg.de/images/slider-01_1.jpg) no-repeat center -81em;
	 position: relative;
 }
 .full-title:before{
	 content: "";
	 background: rgba(0,0,0,0.5);
	 top: 0px;
	 left: 0px;
	 position: absolute;
	 width: 100%;
	 height: 100%;
 }
 .full-title h1{
	 position: relative;
	 color: #ffffff;
	 bottom: -2em;
 }
 .full-title h1 small{
	 /* float: right;
	 padding: 15px 0px; */
	 font-size: 70%;
	 
	 /* font-size: 14px; */
 }
	 /* AS: changed color from 4eae3a to 3a7aae (blue light is also possible 69a2d1)*/
 .breadcrumb-main .breadcrumb{
	 /* AS: old : background: #3a7aae; */
	 /* 2022-05-28: background: #533c00; Farbe wie Hintergrund: #fff7e9*/
	 background: #f2eadd;
	 background-image: url(../images/holz-bg.jpg); background-image: image-set(url(../images/holz-bg.webp) type("image/webp"), url(../images/holz-bg.jpg) type("image/jpeg"))
 }
 .breadcrumb-main .breadcrumb li a{
	 /*2022-05-28: color: #ffffff;*/
	 color: #533c00;
 }
 .breadcrumb-main .breadcrumb li{
	 color: #533c00;
	 /*AS: old value: 4e3914 _ a79981*/
 }
 .breadcrumb-main .breadcrumb-item + .breadcrumb-item::before{
	 color: #533c00;
	 /*AS: old value: 4e3914 _ a79981*/
 }
 .team-members-box{
	 padding: 30px 0px;
 }
 .team-members-box h2{
	 font-weight: 600;
	 font-size: 24px;
	 margin-bottom: 20px;
 }
 .team-members-box .card{
	 box-shadow: 3px 5px 15px rgba(0,0,0, .15);
	 border: none;	
 }
 .team-members-box .card .card-footer{
	 background: #4eae3a;
 }
 .team-members-box .card .card-footer ul{
	 margin: 0px;
	 padding: 0px;
 }
 .team-members-box .card .card-footer ul li{
	 display: inline-block;
 }
 .team-members-box .card .card-footer ul li a{
	 width: 32px;
	 height: 32px;
	 line-height: 32px;
	 background: #4e3914;
	 color: #ffffff;
	 display: inline-block;
	 border-radius: 4.8px;
	 font-size: 14px;
 }
 .customers-box h2{
	 font-weight: 600;
	 font-size: 24px;
	 margin-bottom: 20px;
 }
 
 .project-inner h3{
	 font-size: 20px;
	 font-weight: 500;
	 margin-bottom: 30px;
 }
 
 .pagination_bar .pagination .page-item .page-link{
	 font-size: 20px;
	 background: #4e3914;
	 border: 1px solid #4e3914;
	 color: #ffffff;
	 width: 35px;
	 text-align: center;
 }
 .pagination_bar .pagination .page-item .page-link:hover{
	 background: #725200;
 }
 .portfolio-item h6.card-title a{
	 font-size: 17px;
	 font-weight: 500;
	 margin-bottom: 20px;
	 color: #4e3914;
 }
 .related-projects{
	 padding: 30px 0px; 
 }
 .related-projects h3{
	 font-weight: 600;
	 font-size: 24px;
	 margin: 0px;
	 margin-bottom: 20px;
 }
 .blog-entries .card{
	 box-shadow: 3px 5px 15px rgba(0,0,0, .15);
	 border: none;
 }
 .blog-entries .card .card-body h2.card-title{
	 font-size: 22px;
	 font-weight: 200;
	 
 }



 .blog-entries .card .card-footer{
	 background-color: #b49359;
	 /* AS: old color value 4e3914*/
 }
 .blog-entries .card .card-footer.text-muted{
	 color: #ffffff !important;
 }
 .blog-entries .card .card-footer a{
	 color: #4eae3a;
 }
 .blog-right-side .card{
	 box-shadow: 3px 5px 15px rgba(0,0,0, .15);
	 border: none;
 }
 .blog-right-side .card h5.card-header{
	 background-color: #4e3914;
	 color: #ffffff;
	 font-size: 20px;
	 font-weight: 400;
 }
 .blog-right-side .card .card-body ul li{
	 margin-bottom: 2px;
 }
 .blog-right-side .card .card-body ul li a{
	 border-radius: 4.8px;
	 padding: 6px;
	 background: #4e3914;
	 color: #4eae3a;
	 display: inline-block;
 }
 .pagination_bar_arrow .pagination .page-item .page-link{
	 font-size: 20px;
	 background: #4e3914;
	 border: 1px solid #4e3914;
	 color: #ffffff;
	 width: 120px;
	 text-align: center;
 }
 .pagination_bar_arrow .pagination .page-item .page-link:hover{
	 background: #725200;
 }
 .faq-main{
	 padding: 30px 35px;
	 background: #4e3914;
	 margin: 30px 0px;
 }
 .accordion-single{
	 border-radius: 0px;
	 border: none;
	 border-bottom: 1px solid #e4e8ed;
 }
 .accordion-single .card-header{
	 background-color: transparent;
	 padding: 0px;
	 border: none;
 }
 .accordion-single .card-header h5 a{
	 color: #202428;
	 display: block;
	 position: relative;
	 padding: 21.28px 32px 26.56px 20px;
	 font-size: 18px;
	 text-transform: capitalize;
 }
 .accordion-single .card-header h5 a:hover{
	 color: #4eae3a;
	 text-decoration: none;
 }
 .accordion-single h5 a[aria-expanded="false"]::before {
	 position: absolute;
	 content: "\f0dd";
	 font-family: 'Font Awesome 5 Free';
	 font-weight: 900;	
	 right: 10px;
	 top: 50%;
	 -webkit-transform: translateY(-50%);
	 -ms-transform: translateY(-50%);
	 transform: translateY(-50%);
	 color: #4e3914;
 }
 .accordion-single h5 a[aria-expanded="true"]::before{
	 position: absolute;
	 content: "\f0de";
	 font-family: 'Font Awesome 5 Free';
	 font-weight: 900;
	 right: 10px;
	 top: 50%;
	 -webkit-transform: translateY(-50%);
	 -ms-transform: translateY(-50%);
	 transform: translateY(-50%);
	 color: #4eae3a;
 }
 .error-contents{
	 padding: 30px 0px;
	 max-width: 980px;
	 margin: 0 auto;
	 text-align: center;
 }
 
 .pricing-box{
	 padding: 30px 0px;
 }
 .pricing-box .card{
	 position: relative;
	 overflow: hidden;
	 box-shadow: 3px 5px 15px rgba(0,0,0, .15);
	 border: none;
 }
 .pricing-box .card h3.card-header{
	 padding: 20px 0px;
	 text-align: center;
	 background: #4e3914;
	 color: #ffffff;
 }
 .most_popular{
	 position: absolute;
	 top: 32px;
	 font-size: 12px;
	 text-align: center;
	 width: 181px;
	 padding: 4px 0;
	 right: -36px;
	 transform: rotate(40deg);
	 background-color: #4eae3a;
	 color: #4e3914;
 }
 
 
 .contact-left h3{
	 font-weight: 600;
	 font-size: 24px;
	 margin-bottom: 20px;
 }
 .contact-right h3{
	 font-weight: 600;
	 font-size: 24px;
	 margin-bottom: 20px;
 }
 .contact-right p abbr{
	 font-weight: bold;
	 font-size: 18px;
 }
 
 .help-block ul{
	 margin: 0px;
	 padding: 0px;
	 list-style: none;
	 background: red;
	 color: #fff;
	 padding: 0px 15px;
 }
 
 
 @media (min-width:768px) and (max-width:991px){
	 .navbar-expand-lg.top-nav .navbar-nav .nav-link.dropdown-toggle::after{
		 position: absolute;
		 top: 18px;
		 right: 6px;
	 }
	 /*	h6{
		 padding-left: 10%;
		 padding-right: 5%;
	 }*/
 
	 .top-nav{
		 background-image: url(../images/menue-bg.png); background-image: image-set(url(../images/menue-bg.webp) type("image/webp"), url(../images/menue-bg.png) type("image/png"));
		 background-repeat:repeat;
		 background-position:center;
		 padding-left: 0%;
		 padding-right: 0%;
		 
	 }
 
	 /* Feder für kleine Display */
	 .feder_smart {
	 width: 64px;
	 height: 289px;
	 position: relative;
	 float: right;
	 background-image: url(../images/feder.png); background-image: image-set(url(../images/feder.webp) type("image/webp"), url(../images/feder.png) type("image/png"));
	 background-size: contain;
	 background-repeat: no-repeat;
	 z-index: 100;
	 }
 
	 .feder {
	 width: 1px;
	 height: 1px;
	 position: relative;
	 float: right;
	 background-image: none;
	 background-size: contain;
	 background-repeat: no-repeat;
	 z-index: 0;
	 }

	 .nota {
		width: 1px;
		height: 1px;
		position: relative;
		float: right;
		background-image: none;
		background-size: contain;
		background-repeat: no-repeat;
		z-index: 0;
		}
 
 }
 
 @media screen and (max-width:767px){
	 .navbar-expand-lg.top-nav .navbar-nav .nav-link.dropdown-toggle::after{
		 position: absolute;
		 top: 18px;
		 right: 6px;
	 }
	 .portfolio-main h2{
		 text-align: center;
	 }
	 .customers-box{
		 text-align: center;
	 }
	 .team-members-box h2{
		 text-align: center;
	 }
	 .services-bar h1{
		 text-align: center;
	 }
	 .social_footer_ul li{
		 padding-left: 10px;
		 padding-right: 10px;
	 }
	 .faq-main{
		 padding: 20px 15px;
	 }
	 .accordion-single .card-header h5 a{
		 font-size: 14px;
	 }
	 .top-nav{
		 background-image: url(../images/menue-bg.png); background-image: image-set(url(../images/menue-bg.webp) type("image/webp"), url(../images/menue-bg.png) type("image/png"));
		 background-repeat:repeat;
		 background-position:center;
		 padding-left: 2%;
		 padding-right: 2%;
		 
	 }
	 /* Feder für kleine Display */
	 .feder_smart {
	 width: 64px;
	 height: 289px;
	 position: relative;
	 float: right;
	 background-image: url(../images/feder.png); background-image: image-set(url(../images/feder.webp) type("image/webp"), url(../images/feder.png) type("image/png"));
	 background-size: contain;
	 background-repeat: no-repeat;
	 z-index: 100;
	 }
 
	 .feder {
	 width: 1px;
	 height: 1px;
	 position: relative;
	 float: right;
	 background-image: none;
	 background-size: contain;
	 background-repeat: no-repeat;
	 z-index: 0;
	 }

	 .nota {
		width: 1px;
		height: 1px;
		position: relative;
		float: right;
		background-image: none;
		background-size: contain;
		background-repeat: no-repeat;
		z-index: 0;
		}
 
 }
 
 @media (min-width:320px) and (max-width:575.98px){
	 .navbar-expand-lg.top-nav .navbar-nav .nav-link.dropdown-toggle::after{
		 position: absolute;
		 top: 18px;
		 right: 6px;
		 
 
	 }
	 .portfolio-main h2{
		 text-align: center;
	 }
	 .customers-box{
		 text-align: center;
	 }
	 .team-members-box h2{
		 text-align: center;
	 }
	 .services-bar h1{
		 text-align: center;
	 }
	 .social_footer_ul li{
		 padding-left: 10px;
		 padding-right: 10px;
	 }
	 .faq-main{
		 padding: 20px 15px;
	 }
	 .accordion-single .card-header h5 a{
		 font-size: 14px;
	 }
	 
 
	 .top-nav{
		 background-image: url(../images/menue-bg.png); background-image: image-set(url(../images/menue-bg.webp) type("image/webp"), url(../images/menue-bg.png) type("image/png"));
		 background-repeat:repeat;
		 background-position:center;
		 background-blend-mode:initial;
		 padding-left: 2%;
		 padding-right: 2%;
		 max-width: auto;
		 background-color: antiquewhite;
		 
	 }
	  /* Feder für kleine Display */
	  .feder_smart {
		 width: 64px;
		 height: 289px;
		 position: relative;
		 float: right;
		 background-image: url(../images/feder.png); background-image: image-set(url(../images/feder.webp) type("image/webp"), url(../images/feder.png) type("image/png"));
		 background-size: contain;
		 background-repeat: no-repeat;
		 z-index: 100;
	   }
 
	   .feder {
		 width: 1px;
		 height: 1px;
		 position: relative;
		 float: right;
		 background-image: none;
		 background-size: contain;
		 background-repeat: no-repeat;
		 z-index: 0;
		 }
		 .nota {
			width: 1px;
			height: 1px;
			position: relative;
			float: right;
			background-image: none;
			background-size: contain;
			background-repeat: no-repeat;
			z-index: 0;
			}
 }
 
 .display-5{font-size:1.1em}
 
 .hr_line{
	 border: 0;
	 height:0.15em;
	 background-image: linear-gradient(to right,rgba(0,0,0,0),rgba(66, 43, 0, 0.781),rgba(0,0,0,0));
	 } 
 
 .card-columns_as .card{
	 margin-bottom:.75rem
 }
 @media (min-width:576px)
 {.card-columns_as{
	 -webkit-column-count:4;
	 -moz-column-count:4;
	 column-count:4;
	 -webkit-column-gap:1.25rem;
	 -moz-column-gap:1.25rem;
	 column-gap:1.25rem;
	 orphans:1;
	 widows:1}
 .card-columns_as .card{
	 display:inline-block;
	 width:100%}
 }
 
 .table-primary_as,.table-primary_as>td,.table-primary_as>th{background-color:#b5a185}.table-hover .table-primary_as:hover{background-color:#8c7759}.table-hover .table-primary_as:hover>td,.table-hover .table-primary_as:hover>th{background-color:#8c7759}
 
 .table-active td {padding: 0.15em;vertical-align:top}
 
 /* AS: class to get white text color in any buttons*/ 
 .txtwhite{
	 color:#f5e7d4;
 }
 .txtwhite:hover{ 
	 color:#f5e7d4; 
	 text-decoration:none;
	 }
 
 
 .bg-alight{
	 background-color:#8f733f1c!important
 }
 a.bg-alight:focus,a.bg-alight:hover,button.bg-alight:focus,button.bg-alight:hover{
	 background-color:#dae0e5!important
 }
 
 .bg-blight{
	 background-color:#a3a3a3!important
 }
 a.bg-blight:focus,a.bg-blight:hover,button.bg-blight:focus,button.bg-blight:hover{
	 background-color:#b49359!important
 }
 
 .box_img
 {
 height: 75%;
 }
 
 :root {
		 --card-margin: 1em;
		 --card-margin2: 0em;
	 }
 
 
 /*
	 body {
		 font-family: system-ui, sans-serif;
		 line-height: 150%;
		 background-color: #FFFFDF;
		 background: url(images/rbg1.jpg) repeat;
		 
		 background:url(bilder/html-kurs-logo.gif) repeat-x;
		 
	 }*/
 
 /* Überschrift */
 
	 .container_header {
		 display: flex;
		 flex-wrap: nowrap;
		 max-width: 1100px;
		 margin-left: auto;
		 margin-right: auto;
		 text-align: center;
	 }
 
	 .container_header > * {
		 flex: 1 1 calc(150px + var(--card-margin2));
		 /*
		 flex: 1 1 calc(280px + var(--card-margin));
		 */
	 }
 
	 .card2 {
	   display: flex;
		 /*display: flex;
 
		 flex = Bild ist mal oben mal auf der linken seite vom Text
		 block = bild ist immer oben in dem frame
 
		 */
		flex-wrap: wrap;
		 /*
		 flex-wrap: wrap;
		 background: silver;
		 */
		 height:50px;
		 background: #FFFFDF;
		 border: 1px solid #BDBDBD;
		 margin: var(--card-margin2);
		 justify-content: center;
		 margin-left: 0px;
		 margin-right: 0px;
	 }
 
	 .content2 {
		 align-self: center;
	 }
 
 /* Bilder */
 
	 .container_main {
		 display: flex;
		 flex-wrap: wrap;
		 justify-content: center;
		 align-items: center;
 
		 max-width: 1000px;
		 margin-left: auto;
		 margin-right: auto;
		 text-align: center;
 
	 }
 
	 .container_main > * {
		 flex: 1 1 calc(150px + var(--card-margin));
 
		 /*
		 flex: 1 1 calc(280px + var(--card-margin));
		 */
	 }
 
	 .card_main {
	   display: flex;
		 /*display: flex;
 
		 flex = Bild ist mal oben mal auf der linken seite vom Text
		 block = bild ist immer oben in dem frame
 
		 */
	   flex-wrap: wrap;
		 /*flex-wrap: wrap;*/
	   background: rgb(199, 182, 136);
		 border: 2px solid #9f7919;
	   margin: var(--card-margin);
		 
		 max-width: 200px;
		 height:230px;
		 margin-left: 5px;
		 margin-right: 5px;
 
	 }
 
	 .card_main > * {
	   flex: 1 1 170px;
		 /* flex: 1 1 280px; */
 
	 }
 
	 .card_main_2 {
	   display: flex;
		 /*display: flex;
 
		 flex = Bild ist mal oben mal auf der linken seite vom Text
		 block = bild ist immer oben in dem frame
 
		 */
	   flex-wrap: wrap;
		 /*flex-wrap: wrap;*/
	   background: rgb(199, 182, 136);
		 border: 1px solid #9f7919;
	   margin: var(--card-margin);
		 
		 max-width: 200px;
		 height:170px;
		 margin-left: 5px;
		 margin-right: 5px;
 
	 }
 
	 .card_main_2 > * {
	   flex: 1 1 170px;
		 /* flex: 1 1 280px; */
 
	 }
 
	 .img-thumbnail_2{
		 padding:.25rem;
		 background-color:#fff;
		 border:1px solid #dee2e6;
		 border-radius:.25rem;
		 max-width:100%;
		 height:auto}
 
	 .img_pic_2 {
	   width: 94%;
	   height: 150px;
	   object-fit: contain;
		 object-position: center;
		 /*
		 object-fit: scale-down;
		 object-fit: cover; */
	   display: block;
 
		 /*
		 display: block;
		 */
	 margin-top: 5px;
	 margin-left: 5px;
 
	 }
 
	 .content_main {
		 align-self: center;
		 padding: 0em 0em;
	 }
 
 /* Videos Überschrift */
 
	 .card3 {
	   display: flex;
		 /*display: flex;
 
		 */
		flex-wrap: wrap;
		 /*
		 flex-wrap: wrap;
		 background: silver;
		 */
		 height:30px;
		 background: rgb(199, 182, 136);
		 border: 2px solid #9f7919;
		 margin: var(--card-margin2);
		 justify-content: center;
		 margin-left: 0px;
		 margin-right: 0px;
	 }
 
	 .content3 {
		 align-self: center;
	 }
 
 /* Videos */
 
	 .container_videos {
		 display: flex;
		 flex-wrap: wrap;
		 justify-content: center;
		 align-items: center;
 
		 max-width: 1200px;
		 margin-left: auto;
		 margin-right: auto;
		 text-align: center;
 
	 }
 
	 .container_videos > * {
		 flex: 1 1 calc(200px + var(--card-margin));
		 /*
		 flex: 1 1 calc(280px + var(--card-margin));
		 */
	 }
 
	 .card4 {
	   display: flex;
		 /*display: flex;
 
		 flex = Bild ist mal oben mal auf der linken seite vom Text
		 block = bild ist immer oben in dem frame
 
		 */
	   flex-wrap: wrap;
		 /*flex-wrap: wrap;*/
	   background: rgb(199, 182, 136);
	   margin: var(--card-margin);
		 border: 2px solid #9f7919;
		 max-width: 300px;
		 height:250px;
		 margin-left: 5px;
		 margin-right: 5px;
 
	 }
 
	 .card4 > * {
	   flex: 1 1 300px;
		 /* flex: 1 1 280px; */
 
	 }
 
	 .content4 {
		 align-self: center;
		 padding: 0em 0em;
		 
	 }
 
 /* Bildergrößen für Bereich Bilder */
	 .img_pic {
	   width: 94%;
	   height: 150px;
	   object-fit: contain;
		 object-position: center;
		 /*
		 object-fit: scale-down;
		 object-fit: cover; */
	   display: block;
 
		 /*
		 display: block;
		 */
	 margin-top: 5px;
	 margin-left: 5px;
 
	 }
 
 /* Bildergrößen für Bereich Videos */
	 .img_vid {
	   width: 96%;
	   height: 150px;
	   object-fit: contain;
		 object-position: center;
		 /*
		 object-fit: scale-down;
		 object-fit: cover; */
	   display: block;
 
		 /*
		 display: block;
		 */
	 margin-top: 5px;
	 margin-left: 5px;
	 }
 .card-body{-ms-flex:0.5 0.5 auto;flex:0.5 0.5 auto;padding:0.6rem;background:#fae5c1;background-image: url(../images/menue-bg.png); background-image: image-set(url(../images/menue-bg.webp) type("image/webp"), url(../images/menue-bg.png) type("image/png"));opacity:0.80;} /* note 2025.09.12: background-image: url(../images/menue-bg.png); background-image: image-set(url(../images/menue-bg.webp) type("image/webp"), url(../images/menue-bg.png) type("image/png")) was not here */
 .card-body-erfolge{-ms-flex:0.5 0.5 auto;flex:0.5 0.5 auto;padding:0.6rem;background:#9771356a;} /* note 2025.09.12: background-image: url(../images/menue-bg.png); background-image: image-set(url(../images/menue-bg.webp) type("image/webp"), url(../images/menue-bg.png) type("image/png")) was not here */ 
 .btn-link{font-weight:400;color:#4e3914;background-color:transparent}
 .btn-link:hover{color:#4e3914;text-decoration:none;background-color:transparent;border-color:transparent}
 .btn-link.focus,.btn-link:focus{text-decoration:none;border-color:transparent;box-shadow:none}
 .btn-link.disabled,.btn-link:disabled{color:#6c757d;pointer-events:none}
 
 .container_AS{
	 padding-right:0;
	 padding-left:0;
	 margin-right: 0;
	 margin-left:0}
 
 @media (min-width:544px){
	 .container_AS{max-width:576px}
	 }
 @media (min-width:800px){
	 .container_AS{max-width:768px}
	 }
 @media (min-width:992px){
	 .container_AS{max-width:840px}
	 }
 @media (min-width:1200px){
	 .container_AS{max-width:1040px}
	 } 
 
 card-columns_as .card{
	   margin-bottom:.75rem
 }
 @media (min-width:476px)
   {.card-columns_as{
	   
	   -webkit-column-count:4;
	   -moz-column-count:4;
	   column-count:1;
	   -webkit-column-gap:1.0rem;
	   -moz-column-gap:1.0rem;
	   column-gap:1.0rem;
	   orphans:1;
	   widows:1}
	 .card-columns_as .card{
	   display:inline-block;
	   width:100%}
	 } 
 
 .img-fluid-as {
	 max-width:-moz-available !important; 
	 height:max-content;}
 .h-100-as{height:-moz-available !important}
 .text-center-as{
	 display:-ms-flexbox;
	 max-width: max-content;
	 max-height: max-content;
	 -ms-flex-align:center;
	 align-items:center;
	 -ms-flex-pack:center;
	 justify-content:center;
	 text-align:center}
 .zentriert {
	 display:flexbox;
	 max-width:max-content;
		 margin-left: auto;
		 margin-right: auto;
		 
		 margin-bottom: auto;
		 /*border: thin solid;*/
	 }
 .zentriert_buttons {
		 max-width:max-content;
		 margin-left: auto;
		 margin-right: auto;
		 
		 /* border: thin solid; */
	 }
	 .fixed-top-as {
		 position:relative;
		 top:0;
		 right:0;
		 left:0;
		 z-index:1030;
	 }

/* ===================================================================
   AS-2026 polish — additive only. Nothing above this line is changed.
   Desktop (>=992px) layout is intentionally left untouched; all
   responsive fixes are scoped to max-width:991.98px.
   =================================================================== */

/* --- CTA buttons (content row) --- */
.cta-row{
  margin-top: 1rem;
  margin-bottom: 1.25rem;
}
.cta-row .cta-btn{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 4px 6px;
  min-height: 44px;
  font-weight: 600;
}
.cta-btn.cta-whatsapp,
a.cta-btn.cta-whatsapp{
  background-color: #4eae3a;
  border-color: #4eae3a;
  color: #ffffff;
}
.cta-btn.cta-whatsapp:hover,
a.cta-btn.cta-whatsapp:hover{
  background-color: #5ec549;
  border-color: #5ec549;
  color: #ffffff;
}

/* --- Mobile sticky contact bar (phones/tablets only, hidden >=992px) --- */
.mobile-cta-bar{
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 1098;
  display: flex;
  box-shadow: 0 -2px 8px rgba(0,0,0,.2);
}
.mobile-cta-bar a{
  flex: 1;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 8px;
  font-weight: 600;
  color: #ffffff;
  text-decoration: none;
}
.mobile-cta-bar a:nth-child(1){ background-color: #906700; }
.mobile-cta-bar a:nth-child(2){ background-color: #4eae3a; }
.mobile-cta-bar a:nth-child(3){ background-color: #533c00; }
.mobile-cta-bar a:active{ filter: brightness(1.1); }
/* keep the existing back-to-top button clear of the bar on small screens */
@media (max-width: 991.98px){
  #myBtn{ bottom: 70px; }
}

/* --- Responsive postit fixes (small screens only) --- */
@media (max-width: 991.98px){
  .links{
    width: 100%;
    max-width: 320px;
    height: auto;
    float: none;
    margin: 0 auto 20px auto;
    padding: 56px 28px 28px 28px;
    background-size: 100% 100%;
    overflow: visible;
  }
  .postitgelb{
    width: 100%;
    max-width: 320px;
    height: auto;
    left: 0;
    margin: 0 auto 20px auto;
    padding: 28px 28px 24px 30px;
    background-size: 100% 100%;
    overflow: visible;
  }
  /* center the contact column contents so the notes don't strand left */
  .about-main .col-lg-3{
    text-align: center;
  }
  /* Pen sits to the right of the news banner on mobile/tablet */
  .news-col{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    gap: 4px;
    flex-wrap: nowrap;
  }
  .news-col .links{
    margin: 0;
    flex: 0 1 320px;
  }
  .news-col .feder_smart{
    float: none;
    flex: 0 0 auto;
    width: 48px;
    height: 220px;
    margin-top: 8px;
  }
}
@media (max-width: 359.98px){
  /* Hide the pen on very narrow phones to keep the news readable */
  .news-col .feder_smart{ display: none; }
}

/* --- Navbar logo sizing (replaces missing ant-logo.png) --- */
.navbar-brand{
  display: inline-flex;
  align-items: center;
  padding-top: 4px;
  padding-bottom: 4px;
}
.nav-logo{
  height: 44px;
  width: auto;
  max-width: 100%;
}
@media (max-width: 575.98px){
  .nav-logo{ height: 38px; }
}