/*fonts in index.php*/
@font-face {
  font-family: leetTxt;
  src: url(fonts/Manrope-Regular.ttf);
}
@font-face {
  font-family: leetHead;
  src: url(fonts/geograph-medium.ttf);
}
@font-face {
  font-family: leetThin;
  src: url(fonts/Manrope-Light.ttf) format('truetype');
}
@font-face {
  font-family: leetLogoFont;
  src: url(fonts/geograph-medium.ttf);
}
/* variables - use like this: var(--main-acc-color) */
:root {
  --main-bg-color: #ffffff;
  --sec-bg-color: #f5f5f5;
  --main-txt-color: #000001;
  --sec-txt-color: #787878;
  --main-a-color: #78A341;
  --main-ah-color:#78A341;
  --main-acc-color: #78A341; /* hellgrün */
  --main-font: 'leetTxt';
  --h-font: 'leetHead';
  --hb-font: 'leetHeadBold';
  --gradGreen: linear-gradient(92deg, #4E6C27 -6.17%, #78A341 53.36%);
  --gradGreenDark: linear-gradient(92deg, #4E6C27 -6.17%, #4E6C27 53.36%);
  --DarkGreen: #4E6C27;
  --nocheingrau: #393939;
}

/* ------------------------------------------------- */
body {
  color: var(--main-txt-color);
  background-color: var(--main-bg-color);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #FFF 100%), linear-gradient(76deg, #FFF 10%, rgba(255, 255, 255, 0.00) 101.83%);
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.5;
  text-align: justify;
  font-family: "leetTxt", sans-serif;
}
@media (min-width: 40.0rem) {
  body {
    font-size: 1.4rem;
  }
}

/* reset */
html, body, div, applet, object, iframe,p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {margin: 0;padding: 0;border: 0;font-family: "leetTxt", sans-serif; vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {display: block;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
}
label, legend {
    display: block;
    font-size: 1.3rem;
    font-weight: 500;
    margin-bottom: 0.5rem;
}
.tr-visible{
    display: table-row !important;
}
/*label.top-module{
  font-size: 1.4rem;
}*/
/* grid layout 4 content */
.grid {
  display:grid;
  grid-template-rows: 1fr auto;
  min-height: 90vh;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #FFF 100%), linear-gradient(76deg, #FFF 10%, rgba(255, 255, 255, 0.00) 101.83%);
}
.header{
  z-index: 100;
}
/* Mobile First Media Queries 640 < 1280 < 1920 */
/* Base style */
  .page{
		background-color: var(--main-bg-color);
		padding: 0;
		margin: 0;
		overflow-x: hidden;
	}
  .wrapper{
		max-width:95vw;
        width:95%;
		margin: 0 auto;
		text-align: left;
       /* min-height: 85vh;*/
  }
  .wrapperhead{
		max-width:90vw;
		margin: 0 auto;
		text-align: left;
  }
  #toggle{
    display:inline-block;
    max-width: 30%;
    position: absolute;
    right: 10%;
    top: 1em;
  }
.mobilemenu{display:none;}
.openmenu{display:block;}
.mobilemenu{
    width: 90vw;
    position: relative;
    background-color: #2a2a2a;
}
.mobilemenu .menu__item{
  font-size: 1.1em;
  padding:.3em;
  text-align:center;
  margin-top: -5px;
}
.mobilemenu .menu__item:hover{
  background-color: var(--dark-green);
}
.logo{max-width: 90%;}
@media (min-width: 1000px) {
  .logo{max-width: 40%;}
  #toggle{display:none;}
}
.screen{display:none;}
.mobile{display:block;}
@media (min-width: 40.0rem) {
  .screen{display:block;}
  .mobile{display:none;}
}


/* Larger than mobile screen */
@media (min-width: 40.0rem) {
  .wrapper{
      max-width: 1440px;
      text-align: left;
      width: 90vw;
  }
}

/* Larger than tablet scr een */
@media (min-width: 80.0rem) {
  .wrapper{max-width:1240px;}
  .wrapperhead{max-width:1240px;}
}
.floatright{float:left;}
/* Larger than desktop screen */
@media (min-width: 40.0rem) {
.floatright{float:right;}
}
/* TYPO */
.hiddenz{display:none;}
.left{text-align:left;}
.center{text-align: center;}
.right{text-align:right;}
.resleft{text-align:center;}
.rescenter{text-align: center;}
.resright{text-align:center;}
@media (min-width: 40.0rem) {
  .resleft{text-align:left;}
  .rescenter{text-align: center;}
  .resright{text-align:right;}
}
.smallimg{
    max-width: 360px;
    width: 100%;
    /*margin: 0px auto;*/
}
.flexcentered{
  display:flex !important;
  align-items: center;
  justify-content: center;
  padding: 1em;
  height: 100%;
  min-height: 400px;
}
.banner{
  min-height:300px;
  height:300px;
  background:linear-gradient(359deg, black 0%, transparent 30%), url("/imgs/kursplan-banner-1-1024x379.png");
  background-size: cover;
  background-position: center;
  display:flex !important;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  align-items: flex-end;
  justify-content: center;
  padding: 1em;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: .5em 0;
}

h1, .vh1 {
  font-family: leetLogoFont;
  font-size:calc(0.1vw + 3.1rem);
  line-height: 1.2;
  font-weight: 500;
  letter-spacing: -.5px;
}
.formdiv{
	z-index:3;
}
h1.ueber{
  text-transform: uppercase;
}
.ueberthin{
  text-transform: uppercase;
  font-weight:400;
  font-family: leetTxt;
}
span.ueberGr {
    text-transform: uppercase;
    color: white;
    /* background: beige; */
    border-radius: 8.614px;
    background: #79A342;
    padding: 0.1rem 0.9rem;
    margin-top: 0.3rem !important;
    display: inline-block;
}
.honesmall{
  font-size: 2rem;
  margin-bottom: 2rem;
}
h2, .vh2 {
  font-family: leetLogoFont;
  font-size:calc(0.7vw + 25px) !important;
  line-height: 1.25;
  font-weight: 600;
  padding: 0em 0 0 0;
}
.kursplan h2 {
    font-family: leetLogoFont;
    font-size:calc(1.4em);
    margin-bottom: 0;
    z-index: 1;
}
h3, .vh3 {
  font-size: calc(0.5vw + 12px);
  font-weight: 500;
  line-height: 1;
  line-height: 1.4;
}
h4, .vh4{
  font-family: leetLogoFont;
  font-size: 1em;
  line-height: 1.1;
  font-weight: 400;
}

h5, .vh5 {
  font-size: 1.2em;
  line-height: 1.5;
  font-weight: 500;
}

h6, .vh6 {
  font-size: 1.3rem;
  line-height: 2;
  font-weight: 500;
}
b {
  font-weight: 600;
}
select option {
        white-space: pre-wrap; /* Enables the breaking of lines */
        display: block; /* Ensure the option text is treated as a block for line breaks */
    }
.quform label{
  padding: 0.5em 0;
    color: grey;
}
.abdown {
  padding: 0 0 5em 0;
}
.abstand111{
  padding: .5em 0 0 0;
}
.abstand1{
  padding: 5em 0 0 0;
}
.abstand1rem{
  padding: 1rem 0 0 0;
}
.abstand2{
  padding: 2em 0 0 0;
}
.abstand3{
  padding: 3em 0 0 0;
}
.abstand4{
  padding: 4em 0 0 0;
}
.abstand5{
  padding: 5em 0 0 0;
}
.abstand6{
  padding: 6em 0 0 0;
}
.abstand7{
  padding: 7em 0 0 0;
}
.abstand8{
  padding: 8em 0 0 0;
}
.abstand9 {
  padding: 9em 0 0 0;
}
.abstand10{
  padding: 5em 0 0 0;
}
.abstandKPTOP{
  padding: 2em 0 0 0;
}
.abstand11{
  padding: 11em 0 0 0;
}
.abstand12{
  padding: 12em 0 0 0;
}
.abstand18{
  padding: 18em 0 0 0;
}
.abstand2_4{
  padding: 2em 0 0 0;
}
.abstand4_8{
  padding: 4em 0 0 0;
}
@media (min-width: 40rem){
  .abdown{
    padding: 0 0 5em 0;
  }
  .abstand10{
    padding: 10em 0 0 0;
  }
  .abstandKPTOP{
    padding: 5em 0 0 0;
  }
  .abstand2_4{
    padding: 4em 0 0 0;
  }
  .abstand4_8{
    padding: 8em 0 0 0;
  }
}
hr {
  border: 0;
    border-top: 1px solid #efefef;
    margin: 1rem 0 !important;
    display: block;
    min-width: 100%;
}
.center{text-align:center;}
.reverse{
  flex-direction: column-reverse;
}
@media (min-width: 40rem){
  .reverse{
    flex-direction: row;
  }
}
media
a {
  transition: transform 0.3s ease-in-out;
}

a:hover {
    transform: scale(1.05);
}
.tabbordered .column{
  border-right: 0px solid #d9d9d9;
  text-align:center;
  border-bottom: 1px solid #d9d9d9;
  display:flex;
  align-items: center;
}
.tabbordered .column h5{
min-width: 30vw;
}
.kursdetaili{
    margin-bottom: 1rem;
    margin-top: 1rem;
    margin-right: 1rem;
    max-width: 25px;
}
.kurs_i{    display: flex;
    /* padding-top: 2rem; */
    align-items: flex-start;
}
.kursdetail_i{
  margin-right: 1rem;
  padding-top: 1.5rem;
}
.tab-bordered > * {
    border-bottom: 1px solid #4E6C27 !important;
}
@media (min-width: 40rem) {
  .tabbordered .column h5{
  min-width: 0vw;
  }
  .tabbordered .column:not(:last-child){
    border-right: 2px solid #d9d9d9;
    text-align:left;
  }
  .tabbordered .column{
    text-align:left;
    border-bottom: 0px solid #4E6C27;
    display:block;
  }
  .kursdetaili{
    margin-bottom: 3rem;
    margin-top: 0rem;
    margin-right: 0rem;
     max-width: 42px;
  }
  .kursdetail_i{}
}
.greenbg{
/*  background:var(--gradGreen);
  color: white;

  background-image: url('../img/kreise.svg');
  background-size:  cover;
  background-repeat: no-repeat;
  background-position: center center;*/
  color: white;
  margin-top: 3em;
  background:
      url('../img/kreise.svg') center center/cover no-repeat,
        var(--gradGreen);
  padding-bottom: 7em;
}
.greenbgbanner{
/*  background-image: url('../img/gbanner.png'), url('../img/kreise.svg');
  background-size: cover, contain;
  background-position: center, center;
  background-repeat: no-repeat, no-repeat;*/
  width: 100%;
  color: white;
  margin-top: 3em;
  padding-bottom: 7em;
}
.gbanner{
  width: 95%;
  padding:1.5em 1.5em 6em 1.5em;
  background:var(--gradGreen);
  border-radius: 25px;
  border: 4px solid #cbddc0a8;
  margin: auto;
  /*background-image: url('../img/whiteline.svg'),var(--gradGreen);*/
  /*background-position: center, center;*/
  background: url('../img/whiteline.svg'), #4E6C27;
  background-position: cover;
  background-repeat: no-repeat, no-repeat;
  background-size: cover, cover;
}
@media (min-width: 600px) {
  .gbanner{
    width: 95%;
    padding:1.5em 1.5em 6em 1.5em;
    background:var(--gradGreen);
    border-radius: 25px;
    border: 4px solid #cbddc0a8;
    margin: auto;
    /*background-image: url('../img/whiteline.svg'),var(--gradGreen);*/
    /*background-position: center, center;*/
    background: url('../img/whiteline.svg'), #4E6C27;
    background-position: cover;
    background-repeat: no-repeat, no-repeat;
    background-size: cover, cover;
    width: 105%;
    margin: 0 -2.5%;
  }
}
.gbannertransformer{
    width: 100vw;
    padding: 1.5em 1.5em 21em 1.5em;
    background: var(--gradGreen);
    border-radius: 0;
    border: 0px solid #cbddc0a8;
    margin: 0 0 0 -5vw;
    /* background-image: url(../img/whiteline.svg),var(--gradGreen); */
    /* background-position: center, center; */
    background: url(../img/whiteline.svg), #4E6C27;
    background-position: cover;
    background-repeat: no-repeat, no-repeat;
    background-size: cover, cover;
}
@media (min-width: 40rem) {
  .gbannertransformer{
    width: 95%;
    padding:1.5em 1.5em 10em 1.5em;
    background:var(--gradGreen);
    border-radius: 25px;
    border: 4px solid #cbddc0a8;
    margin: auto;
    /*background-image: url('../img/whiteline.svg'),var(--gradGreen);*/
    /*background-position: center, center;*/
    background: url('../img/whiteline.svg'), #4E6C27;
    background-position: cover;
    background-repeat: no-repeat, no-repeat;
    background-size: cover, cover;
    width: 105%;
    margin: 0 -2.5%;
  }
}
.columnnobreak4{
    flex: 0 0 calc(100% - 2em);
    margin: 0; /* Add column padding */
    box-sizing: border-box; /* Ensure padding and margin are included in the width */
    margin-bottom: 1em;
}
/*.whitewool{background: linear-gradient(92deg, white, transparent);}*/
/* Media query for laptop-sized screens (adjust the breakpoint as needed) */
@media (min-width: 768px) {
    .columnnobreak,
    .columnnobreak4{
        flex: 0 0 calc(50% - 2em); /* Set two cards per row on laptop-sized screens */
    }
    .fancycard{
       height: 160px;
    }
    .column.vorteile{padding: 0em 2em 0em 2em;}
}

/* Media query for larger screens (adjust the breakpoint as needed) */
@media (min-width: 1124px) {
    .columnnobreak {
        flex: 0 0 calc(33.33% - 2em); /* Set three cards per row on larger screens */
    }
    .columnnobreak4 {
        flex: 0 0 calc(25%);
        padding: 2em;
    }
    .punkte .columnnobreak4:nth-child(1),
    .punkte .columnnobreak4:nth-child(2),
    .punkte .columnnobreak4:nth-child(3){
        border-right: 3px solid #ebebeb;
      }
}

.greenbghandsome{
  color: white;
  margin-top: 14rem;
  background:
      url('../img/street22mobile.png') center bottom/contain no-repeat,
      var(--gradGreen);
  padding-bottom: 14em;
}
.greenbgteltante{
  color: white;
  margin-top: 6em;
  background-color: var(--gradGreen);
  background:
      url('../img/satteltante_mobil.png') right bottom/contain no-repeat,
      var(--gradGreen);
  padding-bottom: 30vh;
}
/*@media (min-width: 1000px) {
  .greenbghandsome{
    color: white;
    margin-top: 9rem;
    background:
        url('../img/street22.png') right bottom/contain no-repeat,
        var(--gradGreen);
    padding-bottom: 7em;
    padding-bottom: 8em;
  }
  .greenbgteltante{
    padding-bottom: 7em;
    background:
      url('../img/satteltante1.png') right bottom/contain no-repeat,
      var(--gradGreen);
    padding-bottom: 0em;
  }
}*/
@media (min-width: 780px) {
  .greenbgteltante{
    padding-bottom: 7em;
    background:
      linear-gradient(to right, #53732A 30%, transparent 90%),
      url('../img/satteltante1.png') right bottom/contain no-repeat,
      var(--gradGreen);
    padding-bottom: 0em;
  }
}
@media (min-width: 1000px) {
  .greenbghandsome{
    color: white;
    margin-top: 9rem;
    background:
        url('../img/street22.png') right bottom/contain no-repeat,
        var(--gradGreen);
    padding-bottom: 7em;
    padding-bottom: 8em;
  }
}
.greenbutton{
    background: var(--gradGreenDark);
    border-radius: 30px;
    width: 280px;
    padding: 0.6em 0.1em 0.6em 1.5em;
    color: white;
    font-size: 100%;
    transition: transform 0.3s ease-in-out;
    font-weight: 900;
    margin-top: 1rem;
}
.greenbuttonKursplan{
    /*background: var(--gradGreenDark);
    border-radius: 30px;
    padding:1.5em 2em 1.5em 1.5em;
    color: white;
    font-size: 100%;
    transition: transform 0.3s ease-in-out;
    font-weight: 900;
    margin-top: 1rem;
    text-align: center;*/
}
#getLocationBtn,#originToggleBtn{
    backdrop-filter: blur(43.57499694824219px);
    /* background-color: #ffffff; */
    /* padding: 1em; */
    border-radius: 12px;
    border: 1.05px solid rgba(0, 0, 0, 0.05);
    background: rgba(255, 255, 255, 0.05);
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.08);
    background-color: white;
    margin-bottom: 1em;
    width: 100%;
    padding: 1em;
    font-size: 1.5rem;

    backdrop-filter: blur(43.57499694824219px);
    /* background-color: #ffffff; */
    /* padding: 1em; */
    border-radius: 12px;
    border: 1.05px solid rgba(0, 0, 0, 0.05);
    background: linear-gradient(92deg, #4E6C27 -6.17%, #78A341 53.36%);
    /* box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.08); */
    /* background-color: white; */
    margin-bottom: 1em;
    width: 100%;
    padding: .5em;
    font-size: 1.5rem;
    text-align: center;
    color: #ffffff;
}
.nocheinneuesgraueskasterlweildassoschoenist{
    border-radius: 34px;
    background: rgba(0, 0, 0, 0.08);
    margin-top: 1rem;
    padding: 0.5rem 2rem;
    display: block;
    width: 90vw;
    margin-left: 0rem;
}
@media (min-width: 1000px) {
  .nocheinneuesgraueskasterlweildassoschoenist{
    border-radius: 34px;
    background: rgba(0, 0, 0, 0.08);
    margin-top: 1rem;
    padding: 0.5rem 2rem;
    display: block;
    width: 350px;
    margin-left: -2rem;
  }
}
.nocheinneuesgraueskasterlweildassoschoenist h6{
        padding-left: 1.8rem
}
.nocheinneuesgraueskasterlweildassoschoenistbutton{
    background: #dce1d6;
    border-radius: 30px;
    width: 280px;
    padding: 0.6em 0.1em 0.6em 1.5em;
    color: #4E6C27;;
    font-size: 95%;
    transition: transform 0.3s ease-in-out;
    font-weight: 900;
    margin-top: 1rem;
}
.greenbuttonfilter{
  background: var(--gradGreen);
    border-radius: 15px;
    /*width: 280px;*/
    /* padding: 0.4em 0.1em 0.4em 1em; */
    color: white;
    font-size: 110%;
    transition: transform 0.3s ease-in-out;
    min-height: 40px;
    margin-top: 1em;
    padding: 0 1em;
}
.nocheinneuesgraueskasterlweildassoschoenistbutton:hover,
.greenbuttonfilter:hover,
.greenbutton:hover{
  transform: scale(1.05);
}
.greenbuttonsend{
  background:var(--gradGreen);
  border-radius: 25px;
  width: 280px;
  color: white;
  font-size: 110%;
  transition: transform 0.3s ease-in-out;
  height: 40px;
}
.greenbuttonsend:hover{
  transform: scale(1.05);
}
.whitebutton{
  display:block;
  border: 1px solid white;
  border-radius: 25px;
  max-width: 280px;
  padding: .7em .1em .7em 1em;
  color: white;
  font-size: 110%;
  transition: transform 0.3s ease-in-out;
  margin: 3rem 0;
}
.whitebuttoncenter{
  display:block;
  border: 1px solid white;
  border-radius: 25px;
  max-width: 280px;
  padding: .7em .1em .7em 1em;
  color: white;
  font-size: 110%;
  transition: transform 0.3s ease-in-out;
  margin: 0px auto;
}
.greencenter{
  padding: 0.2em 0em 0em 3em;
  color: #55752B !important;
}
.whitebutton:hover,.whitebuttoncenter:hover{
  transform: scale(1.05);
  color: white;
}
.textBullet {
    white-space: nowrap; /* Prevent text from wrapping */
    margin-right: 5px; /* Add some space between bullet and text */
}
.textBullet::before{
  content: url('../img/checker.png');
  margin: 0em .8em 0 0;
  vertical-align: middle;
}
.telBullet::before{
  content: url('../img/i_phone.png');
  margin: 0em .6em 0 0;
  vertical-align: middle;
}
.mailBullet::before{
  content: url('../img/i_mail.png');
  margin: 0em .6em 0 0;
  vertical-align: middle;
}
.punkte h3{
  margin-bottom: 1.5em;
}
.punkte h6{
  color: rgba(0, 0, 0, 0.80);
}
/* OWN */
.topimg{
  background-image: url(../img/topimg_kursfilter.png);
  background-size: contain;
  background-position: right top;
  width: 100%;
  height: 600px;
  background-repeat: no-repeat;
}
.topimgindex{
  /*background-image: url(../img/macbook1.png);*/
  background-image: none;
  background-position: top right;
  width: 100%;
  background-repeat: no-repeat;
  background-size: 50% auto;
}
.starttopimg{
  padding-top:5em;
  background-image: none;
  background-position: top right;
  width: 100%;
  background-repeat: no-repeat;
  background-size: 80% auto;
}
.mac{
   position: relative;
    right: -2.5em;
  right: 0em;
}
@media (min-width: 40rem) {
  .mac{
    /*display: none;*/
    margin-left: 6em;
    position: relative;
    max-width: 110%;
  }
  .topimgindex{
    background-image: url(../img/lkwindex.png);
    /*background-image: url(../img/startlaptopRechts1.png);*/
    background-position: top right;
    width: 100%;
    background-repeat: no-repeat;
    background-size: 60% auto;
  }
  .starttopimg{
    padding-top:5em;
    background-image: none;
    background-position: top right;
    width: 100%;
    background-repeat: no-repeat;
    background-size: 80% auto;
  }
}
.landing{
    background-image: url(../img/bkf-hero_coming-soon.jpg);
    background-position: top right; /* Position for both images */
    background-repeat: no-repeat; /* Ensure no repetition for both images */
    background-size: 90% auto; /* Size for both images */
    position: relative;
}
@media (min-width: 1000px) {
  .landing{
    background-image: url(../img/greenright.svg), url(../img/bkf-hero_coming-soon.jpg);
    background-position: top 100px right, top right;
    background-repeat: no-repeat, no-repeat;
    background-size: 600px, 90% auto;
    position: relative;
  }
}

.topimgdetail{
 background-image: url(../img/details.png);
    background-size: 50%;
    background-position: right top;
    background-repeat: no-repeat;
}
.topimgdetailinanf{
 /*background-image: url(../img/inanf.png);*/
    background-size: 50%;
    background-position: right top;
    background-repeat: no-repeat;
}
@media (min-width: 1000px) {
  .topimgdetailinanf{
    background-image: url(../img/inanf.png);
    background-size: 50%;
    background-position: right top;
    background-repeat: no-repeat;
    }
}
.grundsatz{
  /*background-image: url('../img/grundsaetze.png');*/
  background-size: contain;
  background-position: center left;
  background-repeat: no-repeat;
}
.erleben{
  /*background-image: url('../img/detail2.png');*/
  background-size: contain;
  background-position: center right;
  background-repeat: no-repeat;
}
.kont{
  /*background-image: url('../img/detail3.png');*/
  background-size: contain;
  background-position: left 5rem;
  background-repeat: no-repeat;
}
.road{
  /*background-image: url('../img/road1.png');*/
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
}
.topimgausbildungscenter {
  background-image: url(../img/topimg_kursfilter.png);
  /*background-size: contain;*/
  background-position: right top;
  width: 100%;
  height: 600px;
  background-repeat: no-repeat;
}
.topimgkursplan {
  /*background: linear-gradient(to top, white 30%, transparent 40%), url(../img/kursplanbild.png) right no-repeat, url(../img/kreise_kursplan.svg) right top/40vw no-repeat;*/
  /*background: linear-gradient(to top, white 30%, transparent 40%), url(../img/kursplanImg.png) right top/50vw no-repeat, url(../img/kreise_kursplan.svg) right top/35vw no-repeat;*/
  background: linear-gradient(to top, white 30%, transparent 40%);
  width: 100%;
  height: 1000px;
  background-repeat: no-repeat;
  width: 100%;
  height: 1000px;
  background-repeat: no-repeat;
}
@media (min-width: 1000px) {
  .topimgkursplan {
    /*background: linear-gradient(to top, white 30%, transparent 40%), url(../img/kursplanbild.png) right no-repeat, url(../img/kreise_kursplan.svg) right top/40vw no-repeat;*/
    /*background: linear-gradient(to top, white 30%, transparent 40%), url(../img/kursplanImg.png) right top/50vw no-repeat, url(../img/kreise_kursplan.svg) right top/35vw no-repeat;*/
    background: linear-gradient(to top, white 60%, transparent 80%), url(../img/kursplanImg.png) right top/50vw no-repeat;
    width: 100%;
    height: 1000px;
    background-repeat: no-repeat;
    width: 100%;
    height: 1000px;
    background-repeat: no-repeat;
    min-height: 1200px;
  }
}
#fuell{
  background-image: url('../img/road1.png');
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
}
.four{
  width: 40% !important;
}
.textGreen{
  background: var(--Gradient-green, linear-gradient(92deg, #4E6C27 -6.17%, #78A341 53.36%));
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.textDarkGreen{
  color: var(--DarkGreen);
}
#eigFilter{
  padding: .5em;
/*  background: #f1f1f1;
  box-shadow: #f1f1f1 0px 5px 15px;*/
  flex-wrap: nowrap;
}
a .courses{
  margin: 1em 0;
  background-color: var(--sec-bg-color);
  background: white;
  border-radius: 5px;
  padding: 0.5em;
  transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
  color: var(--main-txt-color);
}
a .courses:hover{
  background: var(--gradGreen);
  border-radius: 5px;
  color: white;
  transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}
.coursename{
   width: 60% !important;
}
.courseland{
   width: 20% !important;
}
.coursedatum{
   width: 20% !important;
}
.black{
  color: var(--main-txt-color);
}
.grey{
  color: var(--sec-txt-color);
}
.profilepic{
  height: 3em;
  width: 3em;
  border-radius: 50%;
  object-fit: cover;
}
.contactpic{
  display: flex !important;
  display: inline;
}
.contactpic::before{
  content: url('../img/face.png');
  vertical-align: middle;
  margin-right: 0.4em;
}
/* FANCYCARD */
.kreise{
  background-image: url('../img/kreise.svg');
  background-size:  cover;
  background-repeat: no-repeat;
  background-position: center center;
}
.rownobreak{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 -1em;
}
.rownobreak4{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0em;
}
/*.punkte .column,*/
.punkte .columnnobreak:nth-child(1),
.punkte .columnnobreak:nth-child(2),
.punkte .columnnobreak:nth-child(3)
{
  border-right: 0px solid #ebebeb;
}
.columnnobreak{
    flex: 0 0 calc(100% - 2em);
    margin: 0 1em; /* Add column padding */
    box-sizing: border-box; /* Ensure padding and margin are included in the width */
    margin-bottom: 1em;
}
.columnnobreak4{
    flex: 0 0 calc(100% - 2em);
    margin: 0; /* Add column padding */
    box-sizing: border-box; /* Ensure padding and margin are included in the width */
    margin-bottom: 1em;
}
/*.whitewool{background: linear-gradient(92deg, white, transparent);}*/
/* Media query for laptop-sized screens (adjust the breakpoint as needed) */
@media (min-width: 900px) {
    .columnnobreak,
    .columnnobreak4{
        flex: 0 0 calc(50% - 2em); /* Set two cards per row on laptop-sized screens */
    }
    .fancycard{
       height: 160px;
    }
    .column.vorteile{padding: 0em 2em 0em 2em;}
}

/* Media query for larger screens (adjust the breakpoint as needed) */
@media (min-width: 1390px) {
    .columnnobreak {
        flex: 0 0 calc(33.33% - 2em); /* Set three cards per row on larger screens */
    }
    .columnnobreak4 {
        flex: 0 0 calc(25%);
        padding: 2em;
    }
    .punkte .columnnobreak4:nth-child(1),
    .punkte .columnnobreak4:nth-child(2),
    .punkte .columnnobreak4:nth-child(3){
        border-right: 3px solid #ebebeb;
      }
}
.fancyausbildungen{
  margin-top: -7em;
  background-image: url(../img/kreise2.svg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position-y: bottom;
  background-position-x: right;
  background-position: 80% 103%;
}
@media (max-width: 600px) {
    .rownobreak,
    .rownobreak4{
        flex-direction: row; /* Change to column layout on mobile screens */
    }
    .fancyausbildungen{
      margin-top: -17em;
      background-image: url(../img/kreise2.svg);
      background-repeat: no-repeat;
      background-size: cover;
      background-position-y: bottom;
      background-position-x: right;
    }
}
.fancycard {
    width: 100%;
    min-height: 300px;
    background: white;
    border: 2px solid #DBE1D4;
    border-radius: 11px;
    color: var(--main-txt-color);
    box-shadow: 0px 18.9px 75.6px 0px rgba(0, 0, 0, 0.07);
    padding-right: 1em;

    background-image: url('../img/chick.jpg');
    background-size:  35%;
    background-repeat: no-repeat;
    background-position: left center;

    position: relative;

/*    text-align:right;*/
}
@media (min-width: 900px) {
.fancycard {
    width: 100%;
    min-height: 250px;
    background: white;
    border: 2px solid #DBE1D4;
    border-radius: 11px;
    color: var(--main-txt-color);
    box-shadow: 0px 18.9px 75.6px 0px rgba(0, 0, 0, 0.07);
    padding-right: 1em;

    background-image: url('../img/chick.jpg');
    background-size:  35%;
    background-repeat: no-repeat;
    background-position: left center;

    position: relative;

/*    text-align:right;*/
}
}

/* Media query for larger screens (adjust the breakpoint as needed) */
@media (min-width: 1390px) {
  .fancycard {
      width: 100%;
      min-height: 250px;
      background: white;
      border: 2px solid #DBE1D4;
      border-radius: 11px;
      color: var(--main-txt-color);
      box-shadow: 0px 18.9px 75.6px 0px rgba(0, 0, 0, 0.07);
      padding-right: 1em;

      background-image: url('../img/chick.jpg');
      background-size:  35%;
      background-repeat: no-repeat;
      background-position: left center;

      position: relative;

  /*    text-align:right;*/
  }
}
.fC95F {
  background: linear-gradient(to right, rgba(255, 255, 255, 0%), rgba(255, 255, 255, 1) 45%), url('../img/b_lkwF.png') no-repeat;
  background-size: contain;
  background-position: left center;
}

.fC95G {
  background: linear-gradient(to right, rgba(255, 255, 255, 0%), rgba(255, 255, 255, 1) 45%), url('../img/b_lkwG.png') no-repeat;
  background-size: contain;
  background-position: left center;
}

.fC95 {
  background: linear-gradient(to right, rgba(255, 255, 255, 0%), rgba(255, 255, 255, 1) 45%), url('../img/b_lkw.png') no-repeat;
  background-size: contain;
  background-position: left center;
}

.fD95F {
  background: linear-gradient(to right, rgba(255, 255, 255, 0%), rgba(255, 255, 255, 1) 45%), url('../img/b_busF.png') no-repeat;
  background-size: contain;
  background-position: left center;
}

.fD95G {
  background: linear-gradient(to right, rgba(255, 255, 255, 0%), rgba(255, 255, 255, 1) 45%), url('../img/b_busG.png') no-repeat;
  background-size: contain;
  background-position: left center;
}

.fD95 {
  background: linear-gradient(to right, rgba(255, 255, 255, 0%), rgba(255, 255, 255, 1) 45%), url('../img/b_bus.png') no-repeat;
  background-size: contain;
  background-position: left center;
}

.fStapler {
  background: linear-gradient(to right, rgba(255, 255, 255, 0%), rgba(255, 255, 255, 1) 45%), url('../img/b_stapler.png') no-repeat;
  background-size: contain;
  background-position: left center;
}

.fSoon {
  background: linear-gradient(to right, rgba(120, 163, 65, 0%), rgba(120, 163, 65, 1) 45%), url('../img/b_soon.png') no-repeat;
  /*background-image: linear-gradient(92deg, #4E6C27 -6.17%, #78A341 53.36%), url('../img/b_soon.png');   #78A341*/
  background-size: contain, cover;
  background-repeat: no-repeat, no-repeat;
  background-position: left center, center;
  color: white;
}

.fSoon > .fancycardText p {
  color: white !important;
}

.fLasi {
  background: linear-gradient(to right, rgba(255, 255, 255, 0%), rgba(255, 255, 255, 1) 45%), url('../img/b_digi.png') no-repeat;
  background-size: contain;
  background-position: left center;
}

.fLadi {
  background: linear-gradient(to right, rgba(255, 255, 255, 0%), rgba(255, 255, 255, 1) 45%), url('../img/b_ladi.png') no-repeat;
  background-size: contain;
  background-position: left center;
}

.fADR {
  background: linear-gradient(to right, rgba(255, 255, 255, 0%), rgba(255, 255, 255, 1) 45%), url('../img/b_adr.png') no-repeat;
  background-size: contain;
  background-position: left center;
}

.fKran {
  background: linear-gradient(to right, rgba(255, 255, 255, 0%), rgba(255, 255, 255, 1) 45%), url('../img/b_kran.png') no-repeat;
  background-size: contain;
  background-position: left center;
}

@media (min-width: 550px) {
  .fC95F{
    background-color: white;
    background-image: url('../img/b_lkwF.png');
    background-size:  contain;
    background-repeat: no-repeat;
    background-position: left center;

  }
  .fC95G{
    background-color: white;
    background-image: url('../img/b_lkwG.png');
    background-size:  contain;
    background-repeat: no-repeat;
    background-position: left center;
  }
  .fC95{
    background-color: white;
    background-image: url('../img/b_lkw.png');
    background-size:  contain;
    background-repeat: no-repeat;
    background-position: left center;
  }
  .fD95F{
    background-color: white;
    background-image: url('../img/b_busF.png');
    background-size:  contain;
    background-repeat: no-repeat;
    background-position: left center;
  }
  .fD95G{
    background-color: white;
    background-image: url('../img/b_busG.png');
    background-size:  contain;
    background-repeat: no-repeat;
    background-position: left center;
  }
  .fD95{
    background-color: white;
    background-image: url('../img/b_bus.png');
    background-size:  contain;
    background-repeat: no-repeat;
    background-position: left center;
  }
  .fStapler{
    background-color: white;
    background-image: url('../img/b_stapler.png');
    background-size:  contain;
    background-repeat: no-repeat;
    background-position: left center;
  }
  .fSoon{
    background-color: white;
    background-image: url('../img/b_soon.png'), linear-gradient(92deg, #4E6C27 -6.17%, #78A341 53.36%);
    background-size: contain, cover;
    background-repeat: no-repeat, no-repeat;
    background-position: left center, center;
    color:white;
  }
  .fSoon > .fancycardText p{color:white !important;}
  .fLasi{
    background-image: url('../img/b_digi.png');
    background-size:  contain;
    background-repeat: no-repeat;
    background-position: left center;
  }
  .fLadi{
    background-color: white;
    background-image: url('../img/b_ladi.png');
    background-size:  contain;
    background-repeat: no-repeat;
    background-position: left center;
  }
  .fADR{
    background-color: white;
    background-image: url('../img/b_adr.png');
    background-size:  contain;
    background-repeat: no-repeat;
    background-position: left center;
  }
  .fKran{
    background-color: white;
    background-image: url('../img/b_kran.png');
    background-size:  contain;
    background-repeat: no-repeat;
    background-position: left center;
  }
}
.fancycard-content {
    width: 55%;
    padding: 1em;
    box-sizing: border-box;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
}
.fancycardID{
}
.fancycardTitle{
  font-weight: 600;
  font-size: 1.4rem;
  margin-top: -0.5em;
  margin-bottom: 0.5em;
}
.fancycardText{
  font-weight: 400;
  line-height: 120%;
/*  color: rgba(0, 0, 0, 0.80);*/
  font-size: 1.2rem;
}
.detailsAnzeigen{
  padding-top: .7rem;
  font-size: 1.3rem;
  color: var(--DarkGreen);
}
@media (min-width: 600px) {
  .fancycardText{
    font-weight: 400;
    line-height: 120%;
    font-size: 1.2rem;
  }
  .fancycardTitle{
    font-weight: 600;
    font-size: 1.2em;
    margin-top: -0.5em;
    margin-bottom: 0.5em;
  }
  .detailsAnzeigen{
   font-size: 1.3rem;
   color: var(--DarkGreen);
  }
}
.fancycardLink{
  font-size: 1.05em;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  background: var(--gradGreen);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-top: .3em;
}
a .fancycardLink{
  transition: transform 0.05s;
}
a .fancycardLink:hover {
    transform: scale(1.05);
}
.ir_img{text-align:right;}
/* FOOTER */
.footer{
  padding-top: 3em;
}
.footerbottom {
  background-color: var(--DarkGreen);
  margin-top: 3em;
}
.footerbottom::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0%;
  height: 0%;
  background:
    url('../img/dankbarkeit.svg') no-repeat,
    url('../img/vertrauen.svg') no-repeat,
    url('../img/gruppe.svg') no-repeat,
    url('../img/frieden.svg') no-repeat,
    url('../img/fuelle.svg') no-repeat,
    url('../img/schoepferkraft.svg') no-repeat;
  background-size: contain;
  opacity: 0; /* Adjust the opacity as needed (0.0 to 1.0) */
}
.footerbottom p,
.footerbottom a,
.footerbottom a:hover{
  color:white;
  display: inline-block;
  padding: .6em .1em;
}
.footerright{
  text-align: right;
}
.footerflex {
    /*display: flex;*/
    justify-content: space-between;
    align-items: center;
}

.image-link {
  transition: transform 0.3s ease-in-out;
}

.image-link:hover {
    transform: scale(1.1);
}

.image-link img {
    width: 100%;
    height: auto;
    max-width: 70px;
    /*width: 40px;*/
    padding: .5em;
}

.footercontactlinks{
  color: var(--main-txt-color);
  padding-top: .6em;
  padding-bottom: .6em;
  display: inline-block;
  white-space: nowrap;
  width: 100%;
  font-size: 1,1em;
  transition: transform 0.3s ease-in-out;
}
.footercontactlinks:hover{
  transform: scale(1.05);
  transition: transform 0.3s ease-in-out;
}

.fmail::before,
.fmap::before,
.ftel::before{
  display: inline;
  white-space: nowrap;
  margin-right: 1em;
  vertical-align: middle;
}

.fmail::before{
  content: url('../img/i_mail.png');
}
.fmap::before{
  content: url('../img/i_pin.png');
}
.ftel::before{
  content: url('../img/i_phone.png');
}

/* HEADER */
.header {
  background-color: white;
  box-shadow: 1px 3px 35px 16px #ededed;
}
/* SLIDER */
.sliderwool {margin-top: 3em;}
.slider::after{
    content: '';
    position: absolute;
    top: 0;
    width: 30%;
    height: 100%;
    background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1));
    pointer-events: none;
    z-index: 2;
}
.slider::before{
    content: '';
    position: absolute;
    top: 0;
    width: 30%;
    height: 100%;
    background: linear-gradient(to right, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
    pointer-events: none;
    z-index: 2;
}

.slider::before {
    left: 0;
}

.slider::after {
    right: 0;
}
.slider {
    width: 100%;
    overflow: hidden;
    min-height: 150px;
    position: relative;
    z-index: 1;
}

.slides {
    display: flex;
    gap: 3em;
    transition: transform 0.5s ease;
}

.slide {
    flex: 0 0 auto;
}

.slide img {
    max-height: 100%;
    width: auto;
}
/* STREET */
.street{
  /*background-image: url('../img/streetbkf.png');*/
  background-repeat: repeat-x;
  background-size: 30px;
 /* background-position-y: center;*/
  background-position-y: 317px;
}
.streetimg{padding: 2em 0;max-width: 70px;}
@media (min-width: 40rem) {
  .streetimg{padding: 2em 0;max-width: 100%;}
  .street{
    background-image: url('../img/streetbkf.png');
    background-repeat: repeat-x;
    background-size: 30px;
  /* background-position-y: center;*/
    background-position-y: 195px;
  }
}
.bullets{
  padding: .5em;
}
.bullets::before{
 content: url("../img/bullet.png");
 margin-right: .5em;
}
.agenda{
  padding-bottom: 2rem;
}
.agenda ul li{
   padding: .5em;
   color: #4E6C27;
}
.agenda ul li:before{
   content: url("../img/bullet.png");
  margin-right: .5em;
}
/* absslider */
.absslider{

  flex-shrink: 0;
  padding: 2em 2em 1em 2em;

  border-radius: 1.05rem;
  border: 1.05px solid rgba(255, 255, 255, 0.37);
  background: rgba(255, 255, 255, 0.24);
  backdrop-filter: blur(24.149999618530273px);
}
.abscontainer {
  display: flex;
  align-items: center; /* Vertical center alignment */
}
.abscitation{}
.absperson{}
.absname{}
/* GERMANY */
.germany{
  /*background-image: url('../img/mapDE/aut_de_buhaha.svg');*/
  background-image: url('../img/deMapMobile.png');
  background-repeat: no-repeat;
  background-size: contain;
  background-position-y: center;
  background-position-x: center;
  display:flex !important;
  flex-wrap: wrap;
  min-height: 400px;
  margin-top: 8em;
}
@media (min-width: 40rem) {
  .germany{
    margin-top: 0em;
    background-image: url('../img/dekarte.png');
  }
}
.gerimg{

}
  .ger1{
    align-self: flex-start;
    max-width: 60vw;
    padding: 1em;
    display:none;
  }
  .ger2{
    align-self: center;
      max-width: 40vw;
      padding: 1em;
      margin-left: auto;
      display:none;
  }
  .ger3{
    align-self: flex-end;
    max-width: 48vw;
    display:none;
  }
@media (min-width: 1000px) {
  .ger1{
   align-self: flex-start;
   max-width: 310px;
   padding: 1em;
   display:none;
}
.ger2{
   align-self: center;
    max-width: 170px;
    padding: 13em 0 0 0;
    margin-left: auto;
    display:none;
}
.ger3{
  align-self: flex-end;
  max-width: 310px;
  padding: 0 0 0 6em;
  display:none;
}
}
/* FILTER */
/* Style for table rows */
/*.kursplantablediv tbody {
    display: flex;
    flex-wrap: wrap;
    font-weight: 500;
}*/
table {
    border-collapse: separate;
    border-spacing: 0 1em;
    vertical-align: middle;
    padding-left: .5em;
    padding: 0 0.5em 0 0.5em;
    /*display: table;*/
    margin-top: 0.7rem;
}
#scrollcontainer tr{
    -webkit-appearance: none;
    font-size: 1.4rem;
    transition: background-color 0.3s, color 0.3s;
    box-shadow: 0px 1px 7px #939393;
    -webkit-box-shadow: 0px 1px 7px #939393;
    border-radius: 10px;
    /* background: linear-gradient(to bottom, #e6e6e6 0%, #ededed 5%, #ffffff 95%, #e6e6e6 100%); */
    width: 100%;
    margin-bottom: 1em;
    padding: 1em;
    min-height: 80px;
}

#scrollcontainer tr:hover a {
    color: white !important;
}
#scrollcontainer tr:hover{
    /*background: var(--gradGreen);*/
    background: var(--main-a-color);
    color: white !important;
    border-radius: 10px;
    background: linear-gradient(to bottom, #709243 0%, #78a341 5%, #9cbe71 95%, #7ea14f 100%);
}
#scrollcontainer tr a{
      color: #000;
}
#scrollcontainer tr a:hover{
    color: white !important;
}
.theader{
    width: 100%;
    display: block;
}
@media (max-width: 759px){
  .kursetable thead{
    width: 100%;
    /*display: inline-table;*/
    display: block;
    color:Red;
  }
  th {
    font-size: 1.3rem !important;
    color: grey !important;
    font-weight: 500 !important;
    border-bottom: 1px solid #aeaeae;
    padding-bottom: 0.5rem;
  }
  th:nth-child(1) {width: 50%;}
  th:nth-child(2) {width: 25%;}
  th:nth-child(3) {width: 25%;}
  .kursetable tbody{
      display: flex;
      flex-wrap: wrap;
      font-weight:500;
  }
    /* Modul */
  .kursetable tbody td:nth-child(1){order: 1; width: 100% !important;display: inline-block; padding-bottom: 1em;}
  .kursetable tbody td:nth-child(2){order: 2; width: 45% !important;display: inline-block;}
  .kursetable tbody td:nth-child(3){order: 3; width: 45% !important;display: inline-block; text-align: right;}

  .theadKP {
    font-size: 1.3rem !important;
    color: grey !important;
    font-weight: 500 !important;
  }
}
@media (min-width: 760px){
  th {
    font-size: 1.6rem !important;
    color: grey !important;
    font-weight: 500 !important;
    border-bottom: 1px solid #aeaeae;
    padding-bottom: 0.5rem;
  }
  .kursetable tbody {
      font-weight: 500;
      max-height: 120vh;
      overflow-y: auto;
      display: block;
      padding: 0 0.5rem;
  }
  .kursetable tbody td {
    padding: 1em 0.5em 1em 0;
  }
  /* Modul */
  .kursetable tbody td:nth-child(1){
    width: 50%;
    padding-left: 1em;
    border-radius: 10px 0px 0px 10px;
  }
  /* WT */
  .kursetable tbody td:nth-child(2){
    width: 25%;
    padding-left: 0.5em;
  }
  /* datum */
  .kursetable tbody td:nth-child(3){
    width: 25%;
    padding-left: 0.5em;
  }
}
/* Style for the accordion */
.accordion-content {
    display: none;
    padding: 15px;
    border: 1px solid #ddd;
    background-color: #f9f9f9;
    margin-top: 10px;
}

.accordion-content.active {
    display: block;
}

.accordion-toggle {
    cursor: pointer;
}

.acc_toggle {
    float: right;
}

.sub-modules {
    margin-left: 3px;
}

.checkbox {
    margin-top: 10px;
}

.hide {
    display: none !important;
}
/* FORM */
input[type='color'], input[type='date'], input[type='datetime'], input[type='datetime-local'], input[type='email'], input[type='password'], input[type='month'], input[type='number'], input[type='search'], input[type='tel'], input[type='text'], input[type='url'], input[type='week'], input:not([type]), textarea{
    -webkit-appearance: none;
    background-color: var(--main-a-color);
    border: 0.1rem solid var(--main-a-color);
    border-radius: 0rem;
    box-shadow: none;
    box-sizing: inherit;
    padding: 1em;
    width: 100%;
    border-radius: 7px;
    border: 1.102px solid rgba(0, 0, 0, 0.05);
    background: rgba(0, 0, 0, 0.05);
    backdrop-filter: blur(43.57499694824219px);
}

.state {
    fill: gray;
    cursor: pointer;
}
.state:hover {
    fill: var(--gradGreen);
}
.kursplantablediv {
    width: 100%;
    background: radial-gradient(ellipse at center, #ebebeb 0%, #fff0 80%);
}
#autmap{
    display:none;
    max-width: 100%;
}
.ausbildungscenterAutmap{
  display:block !important;
  max-width: 100%;
  padding-top: 2rem;
}
.mapbox {
/*    max-height: 400px;
    margin-top: -5em;*/
}
@media (min-width: 500px) {
  .mapbox {
/*    max-height: 400px;
    margin-top: -10em;*/
    margin-bottom: 2em;
  }
  #autmap{
    display:block;
    max-width: 100%;
}
}
.input-group .sub-modules {
    display: none;
}
.checkboxes{}
.checkboxes .input-group:nth-child(1),
.checkboxes .input-group:nth-child(2),
.checkboxes .input-group:nth-child(3),
.checkboxes .input-group:nth-child(4),
.checkboxes .input-group:nth-child(5),
.checkboxes .input-group:nth-child(6),
.checkboxes .input-group:nth-child(7),
.checkboxes .input-group:nth-child(8){
 /* background: url(../img/caret_down.svg) calc(100% - 2rem) 2rem no-repeat;*/
 background: url(../img/caret_up.svg) calc(100% - 2rem) 2rem no-repeat;
  background-position: right 5%;
}
.checkboxes{}
.checkboxes .input-group:nth-child(1).activated,
.checkboxes .input-group:nth-child(2).activated,
.checkboxes .input-group:nth-child(3).activated,
.checkboxes .input-group:nth-child(4).activated,
.checkboxes .input-group:nth-child(5).activated,
.checkboxes .input-group:nth-child(6).activated,
.checkboxes .input-group:nth-child(7).activated,
.checkboxes .input-group:nth-child(8).activated{
  background: url(../img/caret_down.svg) calc(100% - 2rem) 2rem no-repeat;
  background: url(../img/caret_up.svg) calc(100% - 2rem) 2rem no-repeat;
  background-position: right 5%;
}
.top-module{
  margin: 0em 0 0 0;
  /*new*/
  width: 100% !important;
  display: block;
}
.notmobile{
  width:90vw;
  padding: 0em 0 0 0;
}
@media (min-width: 650px) {
  .notmobile{
    width:90vw;
    padding: 0;
  }
}
.kasterl{
    border: 0px solid #78A341;
    border-radius: 10px;
    padding: 1rem;
    margin-top: 0rem;
}
.kasterl2{
    border: 1px solid #78A341;
    border-radius: 10px;
    padding: 1rem;
}
.kasterl_ausbildungscenter{
    border: 0px solid #78A341;
    border-radius: 10px;
    padding: 0 1rem;
    margin-top: 2rem;
}
.filter-clear-btn{
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    padding: 2rem 0;
    margin-top: 1rem;
    font-size: 1.3rem;
    font-style: normal;
    font-weight: 500;
    font-family: leetTxt;
    width: 100%;
}

@media (min-width: 759px) {
  .notmobile{width:30vw;max-width: 280px;/*position: absolute;*/}
  .nomove{
      float: right;
/*        padding-left: 30% !important;*/
    }
}
.kreise33{
  background-image: url('../img/kreise.svg');
  background-repeat: no-repeat;
  background-size: 120% auto; /* Adjust the size as needed */
  background-position: 40% 4em left; /* 30% right and 4edm from the top */
  display: flex !important;
  flex-wrap: wrap;
}
@media (min-width: 650px){
  .kreise33{
    background-image: url('../img/kreise.svg');
    background-repeat: no-repeat;
    background-size: 60% auto;
    background-position-y: 0.5em;
    background-position-x: left;
    display:flex !important;
    flex-wrap: wrap;
  padding-bottom: 5em;
  }
}
.whitelines{
    background-image:
      url(../img/ausbildungspartnercar1.png),
      url(../img/whiteline.svg),
      var(--gradGreen);
    background-position:
        right bottom,
        center center,
        center center;
    background-repeat:
        no-repeat,
        no-repeat,
        no-repeat;
    background-size:
        contain,
        cover,
        cover;
}
@media (min-width: 1000px){
  .whitelines{
    background-image:
      url(../img/ausbildungspartnercar.png),
      url(../img/whiteline.svg),
      var(--gradGreen);
    background-position:
        right bottom,
        center center,
        center center;
    background-repeat:
        no-repeat,
        no-repeat,
        no-repeat;
    background-size:
        contain,
        cover,
        cover;
  }
}
.headerlanding{background-color:transparent;}
iframe {
    border-radius: 10px;
    overflow: hidden;
    border: 5px solid #dbdbdb;
}
.slide-in-right {
/*  transform: translateX(-50%);
  transition: transform 1s ease-in-out;*/
}
.partner a{
  padding-left: 2em;
  color: var(--main-a-color);
}
.input-group{
  padding: 0.4rem 0.6rem 0.4rem 1.5rem
}
.activated{
  border: 1px solid var(--main-a-color);
  border-radius: 5px;
  background-color: #edf0ea !important;
  padding: 0.5em 0.6em;
  margin-left: 0.6rem;
}
.modul{margin: 0.6rem 0;}
.kursplan-txt{
      padding: 0.5em 0 0.5em .4em;
}
select#dropdown{
    -webkit-appearance: none;
    border-radius: 0rem;
    box-shadow: none;
    box-sizing: inherit;
    padding: 1em;
    width: 100%;
    backdrop-filter: blur(43.57499694824219px);
    background: url("../img/down.svg") calc(100% - 2rem) center no-repeat, #ffffff;
    font-family: "leetTxt", sans-serif;
    padding-right: 3rem;

    border-radius: 12px;
    border: 1.05px solid rgba(0, 0, 0, 0.05);
    background: rgba(255, 255, 255, 0.05);
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.08);

    background: url("../img/down.svg") calc(100% - 2rem) center no-repeat, rgba(255, 255, 255, 0.05);
}
select#dropdown::before{
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #ffffff;
}
.distance{/*display:none*/;font-size:90%;    display: block;}
.postleitzahl input{
    backdrop-filter: blur(43.57499694824219px);
    font-family: 'leetTxt';
    /* background-color: #ffffff; */
    /* padding: 1em; */
    border-radius: 12px;
    border: 1.05px solid rgba(0, 0, 0, 0.05);
    background: rgba(255, 255, 255, 0.05);
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.08);
    background-color: white;
    margin-bottom: 0em;
        font-size: 15px;
}
.postleitzahl input::placeholder {
    color: black;
    opacity: 1;
    font-family: "leetTxt", sans-serif;
}
/* ---------- MENU ------------ */
/* Hamburger icon styling */
.menu-toggle {
    cursor: pointer;
    position: absolute;
    right: 5vw;
    top: 1.5em;
}

.bar {
    display: block;
    background-color: var(--main-a-color);
    width: 24px;
    height: 2px;
    margin: 6px auto;wwd
    transition: all 300ms ease-in-out;
}

.menu-toggle.active .bar:nth-child(2) {
    opacity: 0;
}

.menu-toggle.active .bar:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
}

.menu-toggle.active .bar:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
}

/* Header styling */
.header {
    background-color: #fff;
    color: #333;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
}

.logo {
    display: flex;
    align-items: center; /* Center the logo vertically */
}

.logo img {
    max-width: 200px;
    margin-right: 20px; /* Add some spacing between the logo and menu */
}

.nav{display:none;}
.nav.active{display:block; font-size: 80%;}
@media (min-width:1040px) {
  .nav.active{display:block; font-size: 100%;}
}
.nav ul {
    display: block;
    align-items: center;
    list-style: none;
}

.nav ul li {
    display: block;
    padding: 0.6em;
    border-top: 1px solid #81a26380;
    font-size: 110%;
}

.nav a {
    color: #333;
    text-decoration: none;
}

.nav a:hover {
    color: var(--main-a-color);
    text-decoration: none;
}

@media (min-width: 1040px) {
    .menu-toggle {
        display: none;
    }
    .topnav{
      width: 100%;
    }
    .nav {
        display: inline-block;
        float:right;
        margin-top: 1em;
    }

    .logo {
        display: inline-block;
    }
    .menuwrap{
      display: flex;
      justify-content: space-between;
    }
    .greenbuttonmenu {
        background: var(--gradGreen);
        border-radius: 18px;
        padding: .3em .8em 0.3em .8em;
        color: white;
        transition: transform 0.3s ease-in-out; /* Add transform transition */
        font-weight: 900;
        margin-top: -0.3em;
    }

    .greenbuttonmenu:hover {
        transform: scale(1.05); /* Increase size on hover */
    }
    a.greenbuttonmenu {
        color: white !important;
    }
    .nav ul li {
        display: inline-block;
        padding: 0.6em;
        border-top: 0px solid #81a26380;
        font-size: 110%;
        padding-bottom: 1.2em;
    }
}
/* filter checkboxes */
.top-module input[type="checkbox"],
.modul input[type="checkbox"]{
  display: none;
}

/*.top-module::before,*/
.modul::before
{
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url('../img/unchecked.png');
  background-size: cover;
  margin: 0 5px;
}

/*.input-group.activated .top-module::before,*/
.modul.subactive::before{
  background-image: url('../img/checked.png');
  background-size: cover;
}

.modul {
  display: flex;
  align-items: center;
  margin-top: 5px;
}

.acc_toggle {
  cursor: pointer;
}

.mapicontable{
    margin-right: .3em;
}
.quform-element{
  width: 100%;
}
@media (min-width: 40rem){
  .quform-element{
    display:inline-block;
    width: 48%;
    padding-right: 1%;
    vertical-align: top;
  }
}
.quform-success-message{
  border-radius: 16px;
  border: 1.5px solid var(--Gra, #55752B);
  background: #FFF;
  box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.08);
  padding: 1.2rem;
  margin-bottom: 2rem;
  font-size: 1.5rem;
  color: #4E6C27;
  max-width: fit-content;
}
.quform-error{color:red; padding: 1.2rem;}
.quform-spacer{
  padding: 1rem 0;
}
.rightflexdiv {
    display: flex;
    justify-content: space-between;
    /* flex-wrap: wrap; */
}
#showLessButton, #showLessButton2 {
    font-family: "leetTxt", sans-serif;
    color: #1D1D1D;
    font-size: 90%;
    vertical-align: center;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0.5em;
}
#loadMoreButton, #loadMoreButton2 {
    font-family: "leetTxt", sans-serif;
    color: #1D1D1D;
    font-size: 90%;
    vertical-align: center;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0.5em;
}
.flexx{display:flex;}
.description p{
  margin-bottom: 1rem;
}
.description li,.kursinhalte li{
  display:flex;
}
.description li:before{
  content: url(../img/checker.png);
  flex-shrink: 0;
  margin-right: 5px;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
}
.kursinhalte{
    border-top: 1px solid #96b358;
    padding: 3rem 0;
    margin-top: 3rem;
}
.kursinhalte ul li{
    padding: 0 1rem 0 0;
}
.kursinhalte ul li::before{
   content: url('../img/weisshackerl.svg');
   flex-shrink: 0;
    margin-right: 5px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
}
.ac-btn {
    /* background: linear-gradient(to bottom, #ecf4e7 0%,#dedede 100%); */
    /* border: none; */
    /* border-radius: 5px; */
    color: #0d0d0d;
    font-weight: 600;
    padding: 3rem;
    text-align: left;
    font-size: 18px;
    cursor: pointer;
    border: 1px solid var(--Gra, #55752B);
    background: #FFF;
    box-shadow: 0px 18px 72px 0px rgba(0, 0, 0, 0.07);
    transition: background-color 0.3s, color 0.3s;
    border-radius: 10px;
    margin-bottom: 1em;
}

.linked:hover{
  text-decoration: underline;
}
/* Styling the scrollbar for Webkit-based browsers */
#scrollcontainer::-webkit-scrollbar {
    width: 12px; /* Width of the vertical scrollbar */
}

#scrollcontainer::-webkit-scrollbar-track {
    background: #f1f1f1; /* Color of the scrollbar track */
}

#scrollcontainer::-webkit-scrollbar-thumb {
    background: #888; /* Color of the scrollbar thumb */
    border-radius: 6px; /* Roundness of the scrollbar thumb */
}

#scrollcontainer::-webkit-scrollbar-thumb:hover {
    background: #555; /* Color of the scrollbar thumb on hover */
}

/* Styling the scrollbar for Firefox */
#scrollcontainer {
    scrollbar-width: thin; /* 'auto' or 'thin' */
    scrollbar-color: #888 #f1f1f1; /* thumb and track color */
}
#kursplanheader{
  width: 100%;
}
th:first-child {
    width: 46%;
}
th:nth-child(2) {
    /* Styles for the second th element */
    width: 27%; /* Example width, adjust as needed */
}

th:nth-child(3) {
    /* Styles for the third th element */
    width: 27%; /* Example width, adjust as needed */
}
.dropdown{
  padding-bottom: 2em;
}
.footerleft p {padding: 1.3em 0.1em;}
.impresslogo{
  max-width: 250px;
  display: inline-block;
}
p.quform.label.erklaerung{color:grey; margin-bottom: 1rem;}

#maus{
    font-family: leetLogoFont;
  font-weight:900;

}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
a#CybotCookiebotDialogPoweredbyCybot,
div#CybotCookiebotDialogPoweredByText {
  display: none;
}

#CookiebotWidget .CookiebotWidget-body .CookiebotWidget-main-logo {
    display: none;
}
#CybotCookiebotDialogFooter .CybotCookiebotDialogBodyButton {
height: auto;
}
div.course-details {
   font-size: 90%;
  }
@media (max-width: 800px) {
  div.course-details {
    padding: 1rem;
   font-size: 90%;
  }
  .course-details > .row > .column {
    margin-top: 1rem !important;
  }
}
.field-container {
    display: flex;
    margin-bottom: 0.5rem;
}

.labeldiv {
    flex: 0 0 50%;
    font-weight: bold;
    padding-right: 1rem;
}
.valuediv {
    flex: 1;
}
.valuediv a{
    color: #fff;
}
.row .column.column-50 {
    flex: 0 0 50%;
    min-width: 100% !important;
    max-width: 100% !important;
  }
@media (min-width: 800px) {
  .labeldiv {
    flex: 0 0 30%; /* Fixed width of 30% */
    font-weight: bold;
    padding-right: 1rem; /* Optional padding for spacing */
  }
  .row .column.column-50 {
    flex: 0 0 50%;
        min-width: 45% !important;
    max-width: 45% !important;
  }
}
/* ---------- INDEXFILTER ----------------*/
.indexfilter{
  background-color: #f1f1f1;
    border: 5px solid #A52222;
    border-radius: 4rem;
    padding: 0.5rem 2rem 2rem 2rem;
    flex-direction: column;
}
.filterueber{
  display:block;
  width: 100%;
  min-width: 100%;
  text-align: center;
}
.filterueber h3{
  font-size:1.8rem;
  margin-bottom: 2rem;
}
.indexfiltercolumn{
  display:block;
  width: 100%;
  min-width: 100%;
}
.filter-container .dropdown{
 padding-bottom: 0rem;
}
.filter-container{
  display:flex;
  justify-content: space-between;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px 20px;
}
.indexxdrop,
.distanceslider{
  display:block;
  min-width: 100%;
}
@media (min-width: 1260px) {
  .indexxdrop,
  .distanceslider{
    display:inline-block;
    min-width: 48%;
    width: 48%;
  }
}
option{
  font-family: 'leetTxt';
}
.indexxdrop select,
.indexxdrop input{
    backdrop-filter: blur(43.57499694824219px);
    font-family: 'leetTxt';
    border-radius: 2rem;
    border: 0px solid rgba(0, 0, 0, 0.05);
    background: #e1c6c6;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.08);
    font-size: 1.4rem;
    color: #000000;
}
.distanceslider {
  display: flex;
  flex-direction: column;
  margin-top: 1rem;
}

/* Style the slider */
input[type="range"] {
    -webkit-appearance: none;
    width: 100%;
    height: 10px;
    background: #d3d3d3;
    outline: none;
    -webkit-transition: .2s;
    transition: opacity .2s;
    border-radius: 5px;
    position: relative;
    margin-bottom: 4px;
}

/* Style the thumb (slider handle) */
input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background: #4E6C27;
    cursor: pointer;
    border-radius: 50%;
    position: relative;
    z-index: 444;
}

input[type="range"]::-moz-range-thumb {
    width: 25px;
    height: 25px;
    background: #4E6C27;
    cursor: pointer;
    border-radius: 50%;
    position: relative;
    z-index: 1;
}

/* Style the selected distance text */
#selectedDistance {
    color: #4E6C27;
    font-weight: bold;
    font-size: 1.3rem;
    padding-bottom: 0.6rem;
}

/* Style the slider track */
#sliderTrack {
    position: relative;
    height: 10px;
    background-color: #4E6C27;
    border-radius: 5px;
    transform: translateY(-150%);
    z-index: 333;
    pointer-events: none;
}

.distanceslider{
    margin-bottom: 1.6rem;
    display: none;
}
#locationInput{
  margin-bottom: 1rem;
}
#treffer{
  display:block;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.08);
    margin-bottom: 1em;
    width: 100%;
    padding: 1em;
    backdrop-filter: blur(43.57499694824219px);
    border-radius: 2rem;
    border: 1.05px solid rgba(0, 0, 0, 0.05);
    background-color: #A52222;
    margin-bottom: 1em;
    width: 100%;
    padding: 0.5em;
    font-size: 1.5rem;
    text-align: center;
    color: #ffffff;
}
@media (min-width: 800px) {
  #treffer{
    width: 250px;
    margin: 0 auto;
  }
}
.arr{
      float: right;
    /* padding-right: 1rem; */
    position: absolute;
    right: 2rem;
}
.quform-hidden {
	display: none
}
.originEigene > .coursed{
  background: linear-gradient(92deg, #c0e78d -6.17%, #daefbe 53.36%);
}
@media (min-width: 40rem) {
    .rowena {
        flex-direction: row;
        width: 100%;
    }
}
.rowena {
    display: flex;
    flex-direction: row;
    padding: 0;
    width: 100%;
	padding: 1rem 0 0 0;
	border-bottom: 1px solid #e9e9e9;
}
@media (min-width: 40rem) {
    .kursdetaili {
        margin-bottom: 0rem;
        margin-top: 0rem;
        margin-right: 0rem;
    }
}
.columna:nth-child(1),
.columna:nth-child(2),
.columna:nth-child(3) {
	padding-right:1rem;
}
.columna:nth-child(1) {
}

.columna:nth-child(2) {
}

.columna:nth-child(3) {
	padding-top: 2px;
}
.middleicon {
    vertical-align: middle;
    height: 20px;
    width: auto;
	margin-right: 10px;
}
.textRed{
	background: var(--Gradient-green, linear-gradient(92deg, #A52222 -6.17%, #872828 53.36%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.endform{
	border-radius: 10px;
	border: 1px solid var(--main-acc-color);
	padding: 1rem;
}
.smallimgFrage{max-width:100px;}
.textGreen{color:var(--main-acc-color);}
.row .column.column-76 {
    flex: 0 0 100%;
    max-width: 100%;
}
@media (min-width: 40rem) {
	.row .column.column-76 {
	    flex: 0 0 76%;
	    max-width: 76%;
	}
}
/* Container and grid layout */
/* Container and Flexbox layout */
.network-partners-summary {
    display: flex;
    flex-direction: column; /* Arrange rows vertically */
}

.network-partners-summary.row {
    display: flex; /* Use flexbox for rows */
    flex-wrap: nowrap; /* Prevent row wrapping */
    border-bottom: 1px solid #ddd;
}

/* Ensure each cell maintains equal width */
.cell {
    flex: 1; /* Cells take equal width */
    padding: 10px;
    text-align: center;
    border: 1px solid #ccc;
}

/* Header styles */
.header-row {
    font-weight: bold;
    background-color: #f4f4f4;
        position: fixed;
}

.header-cell {
    font-weight: bold;
    border-bottom: 2px solid #000;
    flex-shrink: 0; /* Prevent shrinking */
}

/* Make the text in header cells vertical */
.vertical-text {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    white-space: nowrap;
}

/* Prevent text overflow */
.cell {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* Specific Flex settings for the second cell */
.row .cell:nth-child(2) {
    flex: 3; /* Make the second cell twice as long as the others */
}

/* General Flex for all other cells */
.row .cell:not(:nth-child(2)) {
    flex: 1; /* Default to equal width for all other cells */
}
.coldcell{font-weight:900;}

/* new index 1024 */
.row .column.column-77 {
  flex: 0 0 100%;
  max-width: 100%;
}
@media (min-width: 40rem) {
  .row .column.column-77 {
    flex: 0 0 77%;
    max-width: 77%;
  }
}
.kascontainer {
    padding: 0;
}
.kascontainer2 {
    padding-top: 5px;
    max-width: 100%;
}
/* Image hover effect */
.s_images {
  transition: transform 0.3s; /* Smooth image transition */
}

.cardiac:hover .s_images {
  transform: scale(1.01); /* Slightly zoom in the image */
}

/* Large and small card styling */
.vh1,
.s_honesmall,
.wh3{
  color:var(--nocheingrau);
}
.wh3{
  font-size: 2rem;
}
.cardiac,.cardiac2 {
    border: 4px solid #d9e5cc;
    border-radius: 1.6rem;
    padding: 1.8rem;
}
.cardiac:hover,.cardiac2:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
  border: 4px solid var(--main-acc-color);
}
.cardiacgrid > a {
  display: block;
}
.cardiacgrid,.cardiacgrid2 {
    display: grid;
    gap: 5px;
    grid-template-columns: 50% 50%;
}
.cardiac.huge {
  grid-column: span 2;
  min-height: 200px;
  grid-row: span 2;
}
.cardiac.tiny {
  font-size: 1em;
  grid-column: span 1;
  grid-row: span 1;
}

@media (min-width: 768px) {
    .kascontainer2 {
        padding-top: 20px;
        max-width: 100%;
    }
    .cardiacgrid {
        display: grid;
        gap: 20px;
        grid-template-columns: 36.1% 36.1% 1fr;
        grid-template-rows: 2;
    }
    .cardiacgrid2 {
        display: grid;
        gap: 20px;
         grid-template-columns: repeat(4, 1fr);
        grid-template-rows: 1;
    }
    .cardiac.huge {
      grid-column: span 1;
      min-height: 200px;
      grid-row: span 2;
    }

    .cardiac.tiny {
        font-size: 1em;
        grid-column: span 1;
        grid-row: span 1;
    }
    .cardiac2.tiny2 {
        font-size: 1em;
        grid-column: span 1;
        grid-row: span 1;
    }
}
.s_images{
  min-height: 50px;
  /*max-width: 80%;*/
  margin: 0 auto;
  padding-top: 10%;
}
.downer{
  display: flex;
  align-items: end;
  height: 100%;
}
.downerer{
  display: flex;
  align-items: end;
  height: 150px;
  flex-wrap: wrap;
}
.hndrd{
  max-width:110px;
}

html body #LeadboosterContainer {
    cursor: default !important;
    /* padding: 0 !important; */
    /* margin: 0 !important; */
    /* box-shadow: none !important; */
    /* min-height: 0 !important; */
    /* min-width: 0 !important; */
    border: none !important;
    display: block !important;
    /* position: fixed !important; */
    /* bottom: 0 !important; */
    /* right: 0 !important; */
    /* visibility: visible !important; */
    /* z-index: 2147483647 !important; */
    /* max-height: 100vh !important; */
    /* max-width: 100vw !important; */
    /* background: none transparent !important; */
    /* opacity: 1 !important; */
    pointer-events: auto !important;
    touch-action: auto !important;
    width: 104px !important;
    height: 104px !important;
    transition: all 0s !important;
    transition-delay: 400ms !important;
    color-scheme: auto;
    position: relative !important;
}

/* Ensure tooltip is hidden by default */
.tooltiptext {
    visibility: hidden;
    width: 250px;
    background-color: rgba(0, 0, 0, 0.7);
    color: #fff;
    text-align: center;
    border-radius: 5px;
    padding: 10px;
    position: absolute;
    z-index: 1;
    bottom: 125%; /* Position above the link */
    left: 50%;
    margin-left: -125px; /* Offset the tooltip by half its width */
    opacity: 0;
    transition: opacity 0.3s;
}

/* Show the tooltip on hover */
.tooltop:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}
.smallimgfr{max-width:100px; padding-top:2rem;}
/* Style for the suggestions container */
#suggestionsList {
    position: absolute;
    border: 1px solid #a1a1a1;
    border-radius: 4px;
    background-color: var(--main-bg-color);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    max-height: 200px;
    overflow-y: auto;
    z-index: 1000;
}
.suggestion-item:first-child {
    border-top: 1px solid #a1a1a1;
}
.suggestion-item {
    padding: 8px 12px;
    cursor: pointer;
    font-size: 14px;
    border-left: 1px solid #a1a1a1;
    border-right: 1px solid #a1a1a1;
    border-bottom: 1px solid #a1a1a1;
}

.suggestion-item:hover {
    background-color: var(--sec-bg-color);
    border-left: 4px solid var(--main-a-color);
}

.suggestion-item.selected {
    background-color: var(--sec-bg-color);
    font-weight: bold;
}
.numberfilter{
  font-size: 170%;
  color: var(--main-acc-color);
  font-weight: 900;
}

/* fixes */

/* ===========================================
   Patch overrides – append to end of style.css
   (non-destructive: only fixes/overrides)
   =========================================== */

/* 1) Restore base link transition (earlier stray “media” token broke it) */
a { transition: transform .3s ease-in-out; }
a:hover { transform: scale(1.05); }

/* 2) Site-wide alignment: use left, not justify */
body { text-align: left; }

/* 3) Fix invalid SVG hover fill (was a gradient var) */
.state:hover { fill: var(--main-acc-color) !important; }

/* 4) Fix typo in footer link size (was 1,1em) */
.footercontactlinks { font-size: 1.1em; }

/* 5) Make buttony links behave consistently */
.greenbutton p { margin: 0; }
a .greenbutton,
a .greenbuttonfilter,
a .whitebutton,
a .whitebuttoncenter,
a .greenbuttonmenu { display: inline-block; text-decoration: none; }

/* 6) Keep focus visible for keyboard users */
a:focus { outline: 2px solid var(--main-acc-color); outline-offset: 2px; }

/* 7) Respect reduced-motion preference */
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}

/* 8) Helpful default for images inside flexible layouts */
img { max-width: 100%; height: auto; }