:root {
  --primary-color:#0D5478;
    --primary-color-pastell: #CBDAE1;
  --secondary-color: #B20E27;
    --secondary-color-pastell: #C13E52;
    --grey-color: #9d9d9c;
  --grey-color-lighter: #f7f7f7;
}

body{
    width:100%;
  max-width:100vw;
  overflow-x:Hidden;
      word-break: break-word;
}

@media only screen and (max-width: 600px) {
  .site-grid{
 max-width: 100vw;
    overflow-x: hidden;
}
  }

/*barrierefreiheit*/
 .first{
  order:1 !important;
}

.second{
  order:2 !important;
}

.third{
  order:3 !important;
}

.width60{
width:60%;
margin:auto;
}

@media
 only screen and (max-width: 1200px) {
  .width60{
    width:80%;
}
}

@media
 only screen and (max-width: 600px) {
  .width60{
    width:98%;
    overflow-x:hidden;
}
}
/*bg*/
.greybg{
  padding:10px;
  background:var(--grey-color-lighter);
}

.primarybg{
  padding:10px;
  background:var( --primary-color-pastell);
  color:var(--primary-color) !important;
}




.row{
  list-style:none;
      padding-left: 0rem;
}

.row li{
  display:grid;
  height:100%;
}
.vorgehenwrapper div{
  display:grid;
  height:100%;
}



.icons{
  display:none !important;
}
.jmodedit{
  display:none;
}
/*deactivate card*/
.card{
  border:0px !important;
}

.card-header {
    color: var(--card-cap-color);
    background-color: unset !important;
  border-bottom: 0px solid !important;
}

.card-body{
  padding:0px !important;
}

.header {
      background-color:#ef6d6d;
	background-image: linear-gradient(to right, #EF6D6D , #c00d0d) ;
}
p{
  margin-bottom:2vh; 
  text-align: justify;
  line-height:1.5;
}

h1,h2{
    margin-bottom:10px; 
}

h3{
  font-weight:400;
}
.centertext{
  text-align:center;
}

.centerblock{
  width:fit-content;
  margin:auto;
}

.white{
  color:white;
}

.verticalcenter{
  place-self:center;
}
.rot{
  /*color:#c00d0d;*/
  color:var(--primary-color);
}
.container-component{
  margin-bottom: 20px;
}
a{
  color:var(--secondary-color);
  text-decoration:none !important;
}
a:hover{
  color:#2A287B;
}

.abstandshalter{
  padding:40px;
}
/*boxen*/
.centerbox{
width:fit-content;
margin:auto;
}

.fullwidthbox {
    margin-left: calc(-50vw + 50% + 10px);
    margin-right: calc(-50vw + 50%);
    max-width: calc(100vw - 20px);
    padding-top: 30px;
    padding-bottom: 20px;
}

.width60{
width:60%;
margin:auto;
}

.centerbox{
width:fit-content;
margin:auto;
}


@media
 only screen and (max-width: 600px) {
  .width60{
    width:100%;
}
}

.width80{
  width:80%;
margin:auto;
}
@media
 only screen and (max-width: 600px) {
.width80{
  width:100%;
}
}

.width50{
  width:50%;
}
@media only screen and (max-width: 1000px) {
  .width50{
  width:100%;
}
  }
/*menü*/
.container-header{
   background-color:var(--primary-color-pastell);
  background-image:none;
}

  .logoimg{
      float: none;
    margin-top: 0px;
}

@media only screen and (max-width: 360px) {
  .logoimg{
    margin-top:2px;
}
  }
/*Banner */
.pinkewellewrapper{
  background-image: url("/images/Elemente/Welle-oben-11072025.svg");
  width:100%;
  height:80vh;
  background-size:cover;
  background-repeat:no-repeat;
  padding:10vw;
  padding-bottom:0vw;
  padding-top:2vw;
}
.pinkewellewrapper .white {
  color:var(--primary-color)!important;
}
/*
@media only screen and (max-width: 1300px) {
 .pinkewellewrapper{
  background-image: url("/images/Elemente/PinkeWelle-2505-1_Zeichenflache-1.png");
  }
}
@media only screen and (max-width: 400px) {
 .pinkewellewrapper{
    height:100vh;
  }
} */
@media only screen and (max-width: 1800px) {
 .pinkewellewrapper{
  height:60vh;
  }
}


@media only screen and (max-width: 1300px) {
 .pinkewellewrapper{
background-position:bottom;
  }
}

@media only screen and (max-width: 400px) {
 .pinkewellewrapper{
   background-position:bottom;
    height:100vh;
  }
}

@media only screen and (max-width: 200px) {
 .pinkewellewrapper{
background-color:var(--primary-color-pastell);
     height:fit-content;
  }
}



.pinkewelle{
  position: absolute;
  top: 0px;
  left: 0px;
}

h1{
  font-size:3.2em;
   text-transform: uppercase;
   font-weight: 600;
}
h2{
  font-size:2em;
   text-transform: uppercase;
   font-weight: 500;
  color:var(--primary-color);
}
@media only screen and (max-width: 900px) {
 h1 {
    font-size:3em;
  }
   h2 {
    font-size:2em;
  }
}
@media only screen and (max-width: 450px) {
 h1,h2 {
    font-size:2em;
  }
}
.headerimg{
      float: right;
    right: 20px;
    top: 200px;
    position: absolute;
    width: 40%;
}
@media only screen and (max-width: 900px) {
  .headerimg{
 position: inherit;
    float: none;
    right: unset;
    top: unset;
    width: 100%;
    margin-top: -40vh !important;
}  
}

@media only screen and (max-width: 200px) {
  .headerimg{
 position: inherit;
    float: none;
    right: unset;
    top: unset;
    width: 100%;
    margin-top: 0vh !important;
}  
}


.headertext{
  width:80%;
}

.headertext b{
      font-size: 30px !important;
    font-weight: 400;
    text-transform: none !important;
  margin-bottom:15px;
}

.com-content-article__body{
  margin-top: -30px;
}
.unterueberschrift{
    font-size: 30px !important;
    font-weight: 400;
    text-transform: none !important;
}
@media only screen and (max-width: 900px) {
  .unterueberschrift{
  font-size:1.5em;
}
  }
/*button*/

.btn-primary{
     background-image: linear-gradient(to right, #d66162 , #c00d0d) ;
    border-color:transparent;
  color:white;
}
.btn{
   background-image: linear-gradient(to right, #d66162, #c00d0d) ;
   border-radius: 50px;
   width: fit-content;
   padding: 10px 15px 10px 15px !important;
  	color:white;
}

.whitebtn{
  background:white;
  color:#c00d0d !important;
   border-radius: 50px;
  width: fit-content;
   padding: 10px 15px 10px 15px;
}

.whitebtn a{
text-decoration:none;
}

.whitebtn:hover{
  opacity:0.6;
}
.redbutton{
  /* background-image: linear-gradient(to right, #d66162 , #DA2727) ;*/
  /*background-color:#c00d0d;*/
  background-color:var(--primary-color);
   border-radius: 50px;
   width: fit-content;
   padding: 10px 15px 10px 15px;
  	color:white;
}

.redbutton:hover, .redbutton:focus{
   /*background-image: linear-gradient(to right, #E36666 , #C62222);*/
  background-color:var(--primary-color-pastell);
color:var(--primary-color) !important;
}
.redbutton a{ 
	color:white;
	text-decoration:none;
}
.redbutton:hover a, .redbutton:focus a{
  color:var(--primary-color) !important;
}
button{
      color: white;
    background-color: transparent;
    border: 0px solid;
}

.btn-modal{
    background: transparent;
    color: #c00d0d !important;
    border-radius: 50px;
    border: 1px solid;
    width: fit-content;
    padding: 10px 15px 10px 15px;
    display: block;
    text-decoration: none !important;
    text-align: center;
}
.btn-modal:hover{  
    background: transparent;
    color: #c00d0d !important;
  border:1px solid #c00d0d;
  opacity:0.5;
} 
/*Lila Welle */ 
.lilawellewrapper{
  background-image: url("/images/Elemente/welle-unten-11072025.svg");
  width:100%;
  color:white;
  background-size:cover;
  background-repeat:no-repeat;
  padding:10vw;
}

.lilawellewrapper button{
  color:white;
  border:1px solid white;
      border-radius: 50px;
    width: fit-content;
    padding: 10px 15px 10px 15px;
  margin-bottom:10px;
}

.lilawellewrapper button:hover{
  background:#DA2727;
  transition:0.5s;
}



/*home */
.vorteilwrapper i{
  margin-bottom:20px;
}
.uberunswrapper{
  padding:0px !Important;
}
.itemid-101 .page-header{
  display:none;
}
/*article content*/
  main {
        margin-top: -15vh !important;
    z-index:5;
  }

@media only screen and (max-width: 1200px) {
  main {
    margin-top: -100px !important;
  }
}
@media only screen and (max-width: 900px) {
  main {
    margin-top: 0px !important;
  }
}



/*footer*/
.footerwrapper{
  background-color:#3C3C3C;
  color:white
}
.footerwrapper a {
  color:white;
  text-decoration:none;
}
.footer{
  background-color:#3C3C3C !Important;
  background-image:none !important;
  margin-top: -1em;
}

.footer .grid-child{
  display:block;
}

/*Börse */
.vfdvlabel a{
    color:#c00d0d !Important;
}


/*tätigkeiten*/
.leistungswrapper a{
  text-align:center;
 display:grid;
}
.leistungswrapper a img{
  margin:auto;
  max-width:80%;
  order:1;
  transition: 0.3s;
}
.leistungswrapper a:hover img{
  opacity:0.8;
  transition: 0.3s;
  filter: saturate(0.5);
}

.leistungswrapper a:hover p{
color:#000000;
  
}

.leistungswrapper a p{
  order:2;
      word-break: break-word;
  text-align:center;
  font-size:14px;
  color:#474747;
}


.leistungswrapper div{
  margin-bottom:20px;
  
}

.leistungsouterwrapper .first{
  order:1;
}

.leistungsouterwrapper .second{
   order:2;
}

@media only screen and (max-width: 768px) {
.leistungsouterwrapper .first{
  order:2;
}

.leistungsouterwrapper .second{
   order:1;
}
}
.mySlides {
  display:none;
  width:100%;
  padding:5vw;
  }
@media only screen and (max-width: 450px) {
  .mySlides {
  padding:7vw;
  }
}

.w3-button {
 border:0px solid white !important;
}

.w3-button :hover{
 color:#48348E !important;
  background-color:transparent !important;
}
.headerimgtaetingkeiten{
  max-width:50%;
  float:right;
  margin-top:-20vw;
}
.taetigkeitenlink:hover{

}

@media only screen and (max-width: 1800px) {
  .headerimgtaetingkeiten{
    margin-top: -10vh !important;
}  
  .headertexttaetingkeiten{
    margin-top: -30vh !important;
  }
}

@media only screen and (max-width: 1000px) {
  .headerimgtaetingkeiten{
 	max-width:100%;
    float: none;
    margin-top: -40vh !important;
} 
  .headertexttaetingkeiten{
    margin-top: 0px !important;
  }
}


.vorgehenwrapper div{
  display:grid;
  padding:10px;
}
.vorgehenwrapper h3{
  order:2;
  margin-bottom:15px;
}

.vorgehenwrapper p{
  order:3;
}

.vorgehenwrapper img{
  order:1;
}


/*visform */

.alert-danger{
  border:0px solid white;
}
.row .kontaktformularwrapper  div{
      padding: 0px !important;
}

.field6 .asterix-ancor, .field7 .asterix-ancor, .field16 .asterix-ancor, .field17 .asterix-ancor{
  display:none !Important;
}

.visCSSlabel{
  width:100%;
}
.field9 .visCSSlabel  {
  display:none
}
.field15 .visCSSmargLeft, .editor{
  margin-left:0px !important;
}
.field14 textarea{
  max-height:30vh;
}
#mod-visform2{
  width:100%;
  margin:Auto;
}
#field14, #field13, #field12, #field15, #field16{
  width:100% !Important;
}
#field10{
  background-color:#045ba0;
  color:white;
}
.visforms h1{
  display:none;
}

.visform .asterix-ancor{
  display:none;
}

.visforms{

}

/*bluebox*/

.primarybox{
    background-color:var(--primary-color-pastell);
      color:var(--primary-color);
  padding:20px !important;
  border-radius:3px;
}
.greybox{
    background:var(--grey-color-lighter);
  padding:20px !important;
  border-radius:3px;
}
.row .greybox, .row .primarybox{
  height:100% !important;
}

.greybox h3, .primarybox h3{
  margin-bottom:20px;
}
.col-md-6{
  margin-top:5px;
}
.row div{
  margin-top:5px;
  padding:10px;
}

/*article modules show hide */
.view-category .notinarticle{
  display:block ;
  
}

.view-category .onlyinarticle{
   display:none !important;
}

.view-category .mod-breadcrumbs__wrapper{
  display:none;
}

.view-article .notinarticle{
  display:none  !important;
  
}
.view-article .onlyinarticl{
   display:block ;
}


.view-article main{
  margin-top:0px !important;
}


.modal-backdrop.show {
   z-index:1 !important;
}

.modal{
  --modal-width:60% !important;
}

/*mitarbeiter fotos */

 
  .mitarbeiterwrapper div{
    display:grid; 
    margin-bottom:20px;
    max-width:100%;
    }
  
    .mitarbeiterfotowrapper{
      width:fit-content;
          /*border:3px solid var(--secondary-color);*/
          margin:auto;
          border-radius:200px;
          overflow:hidden;
      order:1;
    padding: 0px !important;
  }
  
     .mitarbeiterfotowrapper, .mitarbeiterfoto{
       margin-bottom:0px !important;
           background-position: center;
       width:100%;
  }
  
   .mitarbeiterwrapper h3{
     order:2;
     margin-top:20px;
     color:var(--primary-color);
  }
  
    .mitarbeiterwrapper p{
     order:3;
  }
  
  .mitarbeiterfoto{
aspect-ratio:1 !important;
    background-size:contain;
    background-repeat:no-repeat;
          margin-top:0px !important;
    width:100%;
    min-width:8vw;
    padding:0px !important;
    border-radius:400px;
  }
  
  
  
  @media only screen and (max-width: 770px) {
 .mitarbeiterfoto{ 
   margin:auto;
   width:80%;
  
  }
}
  .mitarbeiter1{
    background-image: url("/images/Team/gk_udo_1.webp");
    transition-duration: 1s;
    filter:grayscale(1);
  }
  .mitarbeiter1:hover,  .mitarbeiter1:focus{
      background-image: url("/images/Team/gk_udo_2.webp");
    transition-duration: 1s;
  }
  
   .mitarbeiter2{
    background-image: url("/images/Team/gk_anke_1.webp");
    transition-duration: 1s;
    filter:grayscale(1);
  }
  .mitarbeiter2:hover,  .mitarbeiter2:focus{
      background-image: url("/images/Team/gk_anke_2.webp");
    transition-duration: 1s;
  }
  
     .mitarbeiter3{
    background-image: url("/images/Team/gk_jan_1.webp");
    transition-duration: 1s;
    filter:grayscale(1);
  }
  .mitarbeiter3:hover,  .mitarbeiter3:focus{
      background-image: url("/images/Team/gk_jan_2.webp");
    transition-duration: 1s;
  }
  
  
       .mitarbeiter4{
    background-image: url("/images/Team/gk_jessi_1.webp");
    transition-duration: 1s;
    filter:grayscale(1);
  }
  .mitarbeiter4:hover,   .mitarbeiter4:focus{
      background-image: url("/images/Team/gk_jessi_2.webp");
    transition-duration: 1s;
  }
  
  
  .mitarbeiter5{
    background-image: url("/images/Team/gk_meike_1.webp");
    transition-duration: 1s;
    filter:grayscale(1);
  }
  .mitarbeiter5:hover,   .mitarbeiter5:focus{
      background-image: url("/images/Team/gk_meike_2.webp");
    transition-duration: 1s;
  }
  
  
  .mitarbeiter6{
    background-image: url("/images/Team/gk_yannik_1.webp");
    transition-duration: 1s;
    filter:grayscale(1);
  }
  .mitarbeiter6:hover, .mitarbeiter4:focus{
      background-image: url("/images/Team/gk_yannik_2.webp");
    transition-duration: 1s;
  }


/*kontakt*/

  
  .kontaktformularwrapper{
    margin-top:-10vh !important;
    padding:50px;
    background:var(--grey-color-lighter);
    margin-bottom:20px;
    color:black;
    box-shadow:rgba(100, 100, 111, 0.3) 0px 7px 5px 0px;
  }

@media
 only screen and (max-width: 768px) {
   .kontaktformularwrapper{
    margin-top:10px!important;
     padding:10px;
     margin-bottom:0px;
}
}
  
  .kontaktwrapper{
    padding:40px;
    color:var(--primary-color)!important;
  }

@media
 only screen and (max-width: 768px) {
    .kontaktwrapper{
    padding:0px;
}
}
  
  .kontaktformularwrapper{
    color:var(--primary-color) !important;
    
  }
  
  .kontaktformularwrapper .visform input:not(.btn), .kontaktformularwrapper .visform select, .kontaktformularwrapper .visform textarea{
    background:white !important;
        color:var(--primary-color);
  }
  
   .kontaktformularwrapper  .visform input,  .kontaktformularwrapper  .visform select,   .kontaktformularwrapper .visform textarea{
         border:1px solid var(--primary-color);
  }
  
  
   .kontaktformularwrapper .btn{
     background: var(--primary-color);
    border-radius: 50px;
    padding: 10px 15px 10px 15px !important;
    color: white;
  }
  

      /*nav*/

.container-header .navbar-toggler{
  color:var(--primary-color);
  border:1px solid  var(--primary-color);
}
@media only screen and (max-width: 991px) {
  .metismenu.mod-menu .metismenu-item:not(.level-1)>ul, .metismenu.mod-menu .metismenu-item:not(.level-2)>ul{
    position:relative;
  }
  .metismenu.mod-menu .metismenu-item{
    display:block;
  }
   .metismenu.mod-menu .metismenu-item.active>a{
      width:50%;
    }

  .metismenu.mod-menu .metismenu-item>button{
    float:right;
  }
  }
@media only screen and (max-width: 561px) {
.container-search{
  width:100%; 
}

    .metismenu.mod-menu .metismenu-item{
    display:flex;
  }
  .metismenu.mod-menu .metismenu-item{
    background:white;
    border:1px solid #CBDAE1;
  }
  .metismenu.mod-menu .metismenu-item>a{
        width: 100%;
    text-align: center !important;
  }
  .metismenu.mod-menu .metismenu-item.active>a{
      width:100%;
    }
  
  .metismenu.mod-menu .mm-toggler{
    width:100%;
    padding:10px;
    background: #e9e9e9;
  }
  .metismenu.mod-menu .mm-toggler:after{
        text-align: center;
    margin: auto;
  }
  .container-search .metismenu.mod-menu .metismenu-item>ul{
   position:relative; 
            width: 100%;
        box-shadow: none !important;
  }
 .container-search .metismenu.mod-menu .metismenu-item>ul .metismenu-item{
          background: #CBDAE1;
        border: 1px solid white;
}
  .metismenu.mod-menu .metismenu-item>button{
    float:none !Important;
  }
}

.metismenu.mod-menu .mm-collapse>li>a{
  color:var(--primary-color);
}

.container-header .mod-menu>li>a, .container-header .mod-menu>li>span, .metismenu.mod-menu .mm-toggler{
  color:var(--primary-color);
}

/*nav toggle stays right */
.navbar{
  display:block !important;
  text-align:right;
}
.container-header .container-nav {
    justify-content: space-between !important;
}

/*reveal fade*/ 

.reveal {
  position: relative;
  opacity: 0;
}
.reveal.active {
  opacity: 1;
}
.active.fade-bottom {
  animation: fade-bottom 0.5s ease-in;
}
.active.fade-left {
  animation: fade-left 0.5s ease-in;
}
.active.fade-right {
  animation: fade-right 0.5s ease-in;
}


@keyframes fade-bottom {
  0% {
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-left {
  0% {
    transform: translateX(-100px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fade-right {
  0% {
    transform: translateX(100px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}

/*partner*/
  .netzwerkwrapper img{
  margin-bottom:20px;
  }

.netzwerkwrapper div{
  height:100%;
    margin-top: 5px !important;
    padding-top: 5px;
}

/*neuer Header*/
.headerwrapper{
  background:#CBDAE1;
  color:var(--primary-color);
  padding-left:10vw;
  padding-top:15px;
  }

@media only screen and (max-width: 768px) {
.headerwrapper{
  padding-left:2vw;
  padding-right:2vw;
  }
}


  .headerouterwrapper{
    position:Relative;
    margin-bottom:30px;
     }
  .headerouterwrapper .headerimgnew{
  
    right: 20px;
    position: absolute;
    width: 40%;
bottom:-20px;
  
  }
  
  
  @media only screen and (max-width: 1000px) {
 .headerouterwrapper .headerimgnew{
    width: 60%;
  
  }
}
  
    @media only screen and (max-width: 768px) {
 .headerouterwrapper .headerimgnew{
    position:static;
   width:80%;
margin:auto;
      margin-top:-100px !important;
  
  }
}
  
  
      @media only screen and (max-width: 400px) {
 .headerouterwrapper .headerimgnew{
width:100%;
      margin-top:-10px !important;
  
  }
}

/*netzwerk partner logos */
.partnerlogowrapper {
  height:150px;
  overflow:hidden;
      width: 100%;
}

.partnerlogowrapper img{
          position: relative;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
  max-height:100%;
  height:80%;
  width:auto;
}


/*offline page*/
.offline-card .logo {
  display:none !Important;
}

.offline-card .header{
  min-height:50vh;
  background:none !Important;
}

.offline-card{
  width:100%;
  max-width:60%;
}

.offline-card .logo-icon{
  display:none !Important;
}