@charset "UTF-8";
/* CSS Document */



* {
	margin: 0;
}



html {
    font-size: clamp(1.6px, 1vw, 4.1px);
    font-family: 'BundesSansWeb-regular', sans-serif;
}

body {
    font-size: 3.9rem;
    overscroll-behavior-y: none; /* Prevent pull-to-refresh behavior */
}

button {
    color: black;
}

a:link {
  color: black;
}
.panel a {
  background-color: transparent !important;
}

a:visited {
   color: black;
}


a:hover {
    color: black;
}


a:active {
    color: black;
} 


img {
    width: 100%;
}

a {
  color: black;
}

.tag-button {
box-shadow: 100px 100px 0px 0px rgba(255, 255, 255, 0.9) inset;
opacity: 0.6;
}

.tag-button.active {
box-shadow: 100px 100px 0px 0px rgba(255, 255, 255, 0.0) inset;
color: #000000;
opacity: 1;

}






#head-dati-text {
    display: flex;
width: 700px;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
    }


.head-dati {
    display: flex; 
    gap: 1rem;
width: 90vw;
    flex-direction: column;
  margin-bottom: 4rem;
  margin-left: auto;
  margin-right: auto;
  max-width: 1000px;
justify-content: center;
align-items: center; 
  
}


.dati-text {
  position: absolute;
  z-index: 50;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
min-width: 250px;
  width: 39rem;
}
.dati-h1 {
    font-family: "BundesSerif Web";
    font-size: 8rem; 
    font-style: normal; 
    font-weight: 700;
    line-height: 100%;
    margin-bottom: 4rem;
 
    
}

.dati-h2 {
    font-family: 'BundesSansWeb-regular', sans-serif;
    font-size: 5rem; 
    font-style: normal; 
    font-weight: 600;
    line-height: 100%;
    margin-bottom: 2rem;
    margin-top: 2rem;

}    

.panel h2 {
  background-color: transparent !important;
  margin-bottom: -2rem;
  margin-top: 6rem;
}


.dati-p {
  color: var(--black, #000000);
text-align: left;
font-family: 'BundesSansWeb-regular', sans-serif;
font-size: 16px;
font-weight: 400;
position: relative;
align-self: stretch;

}

.dati-body button, .dati-body select, .dati-body input {
  min-height: 12rem;
    padding: 2rem;
     border: 1rem solid #FFFFFF;
  outline: 0.5rem solid #004377;
    font-size: 4.2rem;
}

.dati-frame {
     border: 1rem solid #FFFFFF;
  outline: 0.5rem solid #004377;
}


.accordion {
    background-color: transparent;
  cursor: pointer;
  width: 100%;
  border: none;
    border-bottom-width: medium;
    border-bottom-style: none;
    border-bottom-color: currentcolor;
  text-align: left;
  outline: none;
  transition: 0.4s;
  border-bottom: 1px solid #010e52;
}

.dati-pro-p {
  text-align: left;
  position: relative;
  padding: 1rem;
}

.slide, .slide * {
  background-color: lightgray;
}

.panel {
  display: none;
  overflow: hidden;
background-color: white !important;
}

.panel img {
  margin-bottom: 2rem;
}

.bundesland-item {
position: absolute;
}


.technologische-innovation,
.technologische-innovation *{
  background-color: #99B7C8;
}

.sozio-technische-innovation,
.sozio-technische-innovation *{
  background-color: #9F83A8;
}


.soziale-innovation,
.soziale-innovation * {
  background-color: #D9668A;
}

.optik---photonik,
.optik---photonik *{
  background-color: #99B7C8;
}

.sicherheitstechnologie,
.sicherheitstechnologie *{
  background-color: #9F83A8;
}
.oeffentliche-verwaltung,
.oeffentliche-verwaltung * {
  background-color: #D9668A;
}

.sensorik---elektronik---mikrosystemtechnik,
.sensorik---elektronik---mikrosystemtechnik *{
  background-color: #99CDD1;
}



.produktions---verfahrens---umwelttechnik,
.produktions---verfahrens---umwelttechnik *{
    background-color: #E699B1;
}



.neue-materialien---nanotechnologie,
.neue-materialien---nanotechnologie *{
  background-color: #C9D199;
}

.medizintechnik---pharmazeutik,
.medizintechnik---pharmazeutik *{
  background-color: #9ECAE4;
}

.maschinenbau---metallverarbeitung,
.maschinenbau---metallverarbeitung *{
  background-color: #CBB0A3;
}

.logistik---verkehr,
.logistik---verkehr *{
  background-color: #99D1B3;
}

.kunst---unterhaltung---erholung,
.kunst---unterhaltung---erholung *{
  background-color: #99A3C8;
}



.ki---maschinelles-lernen,
.ki---maschinelles-lernen *{
  background-color: #76A4BE;
}

.informationstechnik---medien,
.informationstechnik---medien *{
  background-color: #D8CDDC;
}

.gesundheits---sozialwesen,
.gesundheits---sozialwesen *{
  background-color: #E699B1;
}



.erziehung---unterricht,
.erziehung---unterricht *{
  background-color: #c3e0e1;
}




.energiewirtschaft---energietechnik,
.energiewirtschaft---energietechnik *{
  background-color: #E4E8BE;
}




.bau---rohstoffe,
.bau---rohstoffe *{
  background-color: #70B0D6;
}

.biotechnologie---chemie---ernaehrung,
.biotechnologie---chemie---ernaehrung *{
  background-color: #E2D6D6;
}

.andere-und-uebergreifende-themen,
.andere-und-uebergreifende-themen *{
  background-color: #D1D1D1;
}





.themenfeld-container {

  position: relative;
 overflow: clip;}

.themenfeld-item {
  height: 1rem;
 }



.themenfeld-count {
  bottom: 70%;
/*  position: absolute;*/
  left: 30%;
}


.project {
    background-color: transparent;
}



.project-berlin {
 left: 72rem;
  top: 32rem;
}

.project-nordrhein-westfalen {
left: 6rem;
  top: 43rem;
}

.project-rheinland-pfalz {
  left: 9rem;
  top: 75rem;
}

.project-schleswig-holstein {
  left: 33rem;
  top: 4rem;
}

.project-brandenburg {
  left: 76rem;
  top: 47rem;
}

.project-thueringen {
 left: 47rem;
  top: 64rem;
}

.project-bayern {
left: 46rem;
  top: 78rem;
}

.project-niedersachsen {
  left: 6rem;
  top: 21rem;
}

.project-sachsen-anhalt {
  left: 53rem;
  top: 40rem;
}

.project-bremen {
 left: 31rem;
  top: 29rem;
}

.project-mecklenburg-vorpommern {
left: 62rem;
  top: 16rem;
}

.project-baden-wuerttemberg {
  left: 25rem;
  top: 95rem;
}

.project-sachsen  {
left: 70rem;
  top: 61rem;
}

.project-hessen {
  left: 29rem;
  top: 65rem;
}

.project-hamburg {
  left: 42rem;
  top: 14rem;
}

.dati-pro-p h2 {
  display: flex;
  justify-content: space-between;
}

.dati-p {
    margin-top: 4rem;
  margin-bottom: 4rem;

    background-color: transparent;
}


#tag-container {

  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
  padding: 2rem;
        margin-top: 3rem;
    margin-bottom: 3rem;
    justify-content: center;

}

.dati-artist-card {
    flex: fit-content;
    padding: 0;
    flex-flow: inherit;
}


.dati-artist {
    padding: 4rem;
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}

.group-item {
  font-size: 9rem;
  max-width: 27rem;
  line-height: 1;
  font-weight: bolder;
  color: #004377;
  position: absolute;
  min-width: 22rem;
}

#dati-Ost {
  left: 54rem;
  top: 45rem;
}

#dati-West {
  top: 53rem;
  left: 10rem;
}

#dati-Süd {
  left: 38rem;
  top: 83rem;
}

#dati-Nord {
  left: 38rem;
  top: 18rem;
}


#autocompleteList {
  visibility: collapse;
}

.dati-h2-titel {
  margin-top: 6rem;
}

.legende,
.legende * {
    box-sizing: border-box;
}

.legende {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: flex-start;
    justify-content: flex-start;
    flex-shrink: 0;
    position: relative;
    max-width: 100%;

}

.leg-1 {
    padding: 4px 0px 4px 0px;
    display: flex;
    flex-direction: row;
    gap: 16px;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
}

.leg-arow {
  width: 0rem;
  height: 0rem;
  border-top: 2rem solid transparent;
  border-bottom: 2rem solid transparent;
  border-right: 10rem solid;
  position: relative;
  min-width: 12rem;
}

.col-sprech {
  border-right: 10rem solid #00848B;
  color: #00848B;
}

.col-manag {
  border-right: 10rem solid #55246B;
  color: #55246B;
}

.projektleitung.dati-p p {
  background-color: transparent;
}

.projektleitung.dati-p p:nth-of-type(even) {
margin-bottom: 2rem;
}


