html {
  scroll-behavior: smooth;
}

*{
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}


body {
      background-color: #00A0C6 !important;
      font-family: 'Nunito', sans-serif;
}

a{
  color: white;
  text-decoration: underline;
}

a:visited {
  color: white;
  text-decoration: underline;
}

.modal {
  text-align: center;
}










.intro-animation{
  width: 100vw;
  height: 100vh;
  background-color: #F8EEDE;

}

.menu-wrapper{
  display: flex;
    padding: 30px;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    color: #00A0C6;
}

.cont{
  width: 100vw;
  height: auto;
  display: flex;
}

.overlap{
  background-color: #FFB3BD;
  width: 50vw;
  /* aspect-ratio: 1/0.9; */
  margin-top: -15%;
}

.start{
  background-color: #FF5D1A;
  width: 50vw;
}

.running {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  height: 18%;
  min-height: 130px;
}

#runningp{
  position: relative;
  font-size: 7rem;
  font-weight: 600;
  color: #00A0C6;
  line-height: 1.3em;
}

#runningp2{
  position: relative;
  font-size: 7rem;
  font-weight: 600;
  color: #00A0C6;
}

.textcon{
  height: auto;
  color: #00A0C6;
  flex: 1; /* or flex-grow: 1  */;
  display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: 40px;
    padding-bottom: 40px;
}

.textcon h1, h2{
  margin: 0 auto;
  text-align: center;
  width: 80%;
  color: #00A0C6;
  font-size: 1.7em;
}




@media screen and (max-width: 1200px) {
  #runningp{
    font-size: 4rem;
    color: #00A0C6;
    line-height: 1.3em;
  }
  
  #runningp2{
    font-size: 4rem;
  }

  .running {
    min-height: 0px;
    height: 13%;
    
  }

  .textcon h1, h2{
    margin: 0 auto;
    text-align: center;
    width: 90%;
    font-size: 1.4em;
  }
}





.containers{
  height: 100%;
  display: flex;
  flex-direction : column;
}

.start{
  background-image: url(img/grid.png);
  background-repeat: repeat;
  display: flex;
  justify-content: center;
  text-align: center;
  align-items: center;
  position: relative;

}

.start a{
  width: 65%;
  transition: 0.2s;
}

.start a:hover{
  width: 70%;
  transition: 0.2s;
}

.minmin{
  position: absolute;
  bottom: 0;
  right: 0;
}


.illustration, .wieso{
  width: 50vw;
  color: white;
}

.wieso{
  padding: 30px;
  width: 40%;
}

.wieso h3{
  font-size: 6em;
  font-weight: 600;
  line-height: 1.1em;
  padding-bottom: 50px;
  padding-top: 80px;
}

.wieso p{
  font-size: 1.2em;
}


.illustration{
  display: flex;
  justify-content: center;
  align-items: center;
}

.illustration img{
  width: 500px;
  height: auto;
  margin: 0 auto;
}




@media screen and (max-width: 1200px) {
 
  .wieso{
    padding: 30px;
    width: 90%;
  }
  
  .wieso h3{
    font-size: 4em;
    font-weight: 600;
    line-height: 1.1em;
    padding-bottom: 30px;
    padding-top: 30px;
  }
  
  .wieso p{
    font-size: 1.1em;
  }

}




.gap{
  gap: 6%;
}

.flex div{
  width: 50vw;
}

.pad30{
  padding: 30px;
}

.pad60{
  padding: 80px;
}

.pad6{
  padding: 0px 80px 80px 80px;

}

.fliesstext{
  font-size: 1.2em;
}

.fliesstext a{
  color: #00A0C6;
}

mark{
  background-color:yellow;
  background-blend-mode: multiply;
  padding:0em 0.2em; 
  color: #00A0C6;
}

a{
  color: #00A0C6;
}




@media screen and (max-width: 1200px) {
 
  .fliesstext{
    font-size: 1.1em;
  }
}



.bigbutton img{
  width: 100vw;  
}

.footerlarge{
  background-color: white;
  display: flex;
}

.footerlarge div{
  width: 50vw;
}

.ttt{
  background-color: #FE5D1A;
  color: white;
  position: relative;
}

.innerttt{
  display: flex;
  padding: 60px;;
}

.footerlarge ul li{
  list-style: none;
}

.footerlarge a{
  color: white;
}


.logoleiste{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-self: center;

}






@media screen and (min-width: 768px) {
  .modal:before {
    display: inline-block;
    vertical-align: middle;
    content: " ";
    height: 100%;
  }
}

.modal-dialog {
  display: inline-block;
  text-align: left;
  vertical-align: middle;
}

/*Small devices (landscape phones, 576px and up)*/
@media (max-width: 576px) {

  .menu{
    list-style: none;
    color: white;



  }



  .menu ul{

      display: flex;
justify-content: center;

  }






 }


 /*Small devices (landscape phones, 576px and up)*/
 @media (max-width: 1230px) {

     .menu a{
      font-size: 0.9rem;
     }
   }














.menu a {
  border-bottom: 2px solid #FFFFFF;
  text-decoration: none;
}

.container1
    {background-color: #FFC429;
    padding-bottom: 55px;
    padding-top: 5px;}

    .container1 h1
            {margin-top: 130px;
            margin-bottom: 130px;}


    @media (max-width: 820px) {


    .container1
          {
            padding-bottom: 60px;
            padding-top: 40px;
          }

    .container1 h1
      {
        margin-top: 40px;
        margin-bottom: 90px;
        font-size: 2rem;}

    }





.container2
        {background-color: #FFFFFF;
        padding: 80px;
        color:#1B87FE;
      }
      .container2 h1
              {color: #1B87FE;}

              .container2 p
                      {text-align: center;

                      padding-left: 50px;
                      padding-right: 50px;
                    font-size: 16pt;
                  }




                                    @media (max-width: 576px) {



                                      .container2{
                                              padding: 10px;
                                            }

                                            .container2 h1
                                                    {padding-top: 60px;
                                                    font-size: 2rem;}

                                                    .mobile p
                                                            {
                                                                padding-top: 20px;
                                                            padding-bottom: 80px;
                                                            padding-left: 12px;
                                                            padding-right: 12px;
                                                            font-size: 1rem;

                                                        }
                                                        .container2 p
                                                                {text-align: center;

                                                                padding-left: 12px;
                                                                padding-right: 12px;
                                                              font-size: 1rem;
                                                            }

                                    }







                  @media (max-width: 820px) {



                    .container2{
                            padding: 20px;
                          }

                          .container2 h1
                                  {padding-top: 60px;}

                                  .mobile p
                                          {
                                              padding-top: 70px;
                                          padding-bottom: 80px;

                                      }


                  }




.container3{
  background-color: #b4d0ff;
}

.container4{
  background-color: #b4d0ff;
  padding-bottom: 40px;
  padding-top: 70px;
}

.container4 h1
        {margin-top: 100px;
        margin-bottom: 40px;
        color: #1B87FE;}

        .container4 p
                {text-align: center;
                padding-top: 100px;
                padding-left: 50px;
                padding-right: 50px;
              font-size: 16pt;
            color: #1B87FE;}


.logoleiste{
  width: 80%;
  background-color: white;

}


@media (max-width: 820px) {


  .logoleiste{
    width: 100%;
    background-color: white;

  }

}



h1
    {
      color: white;
      text-align:center;
    }

#img2
    {width:100%;
    height: 230px;}


.umfragestart{
    background-color: #F2F2F2;
    text-decoration: none !important;

}



.fit-image{
    width: 100%;
    object-fit: cover;
    }

    .fit-image-small{
        width: 70%;
        object-fit: cover;

        }

.btn1{
  float: left;
  list-style: none;
  border: none !important;
  padding-right: 20px;
}

.btn1 a{
  color: #00A0C6;
  border-bottom: 2px solid #00A0C6;
}

.btn2{
    float: right;
    margin-right: 40px;
    list-style: none;
}

.btn2 a{
  color: #1B87FE;
  border-bottom: 0px solid #1B87FE;
}

.btn2 img{

  height:60px;margin-top:-35px;


}



/*Small devices (landscape phones, 576px and up)*/
@media (max-width: 576px) {


  .btn2{

      float: left;
      padding-top: 30px;
      margin-right: 0px;

  }

  .btn2 img{

    height:45px;margin-top:-130px;
    margin-left: 200px;


  }


  .btn1{
    float: none;

  }

 }


 .fact{
   width: 120px;

 }

.facts{
  width: 120px;
  margin-right: 60px;
}

/*Small devices (landscape phones, 576px and up)*/
@media (max-width: 576px) {
  .facts{
    width: 80px;
    margin-right: 20px;

  }


   .fact{
     width: 80px;

   }
 }






.masonry-column {
  padding: 0 1px;
}

.masonry-grid > div .thumbnail {
  margin: 5px 1px;
}

.container-fluid {
  padding-right: 0px !important;
  padding-left: 0px !important;
      overflow-x: hidden;
}

.col-lg-6{
  padding-right: 0px !important;
  padding-left: 0px !important;
      overflow-x: hidden;
}

.no-gutter-card-deck.card-columns {
  column-gap: 0;
}



.header1{
  background-color: #1B87FE;
  padding: 80px;
  text-align: center;
  color: white;
}

.header1 h1{
  font-size: 2rem;

}


.header2{
  background-color: #FF7139;
  padding: 80px;
  text-align: center;
  color: white;
}

.header2 h1{
  font-size: 2rem;

}

.footer1{
  background-color: #1B87FE;
  padding: 80px;
  text-align: center;
  color: white;
}

.footer1 h1{
  font-size: 2rem;
  padding-bottom: 30px;
}



.footer2{
  background-color: #FF7139;
  padding: 80px;
}



    @media (max-width: 820px) {

      .footer2{
        text-align: center;

      }

      .footer2 ul {
        display: flex;
  justify-content: center;
      }


    }


.footer2 p{
  color: white;
}

.footer2 li{
  list-style: none;
  float: left;

}

.footer2 ul {

  margin: 0;
  padding:0

}


.infos{
  background-color: #fb733b;
  width: 100%;
  padding: 30px;
}

.center{
  position: relative;
}


.infos ul{
  margin: 0;
  padding:0;
}

@media screen and (min-width: 300px) {
  .bricklayer-column-sizer {
    /* If page is greater than 300px, columns will be 20% wide. */
    width: 100%;
  }
}


@media screen and (min-width: 1170px) {
  .bricklayer-column-sizer {
    /* If page is greater than 700px, columns will be 5% wide. That means there will be lots of columns */
    width: 50%;
  }
}


.box {
  margin: 0;
}

.bricklayer-column {
padding: 0px !important;}



.morecontainer{
  max-width: 900px;
  padding: 100px;
}

.morecontainer b{
  font-family: 'Nunito', sans-serif;
  font-weight: 700;
}

.morecontainer i{
  font-family: 'Nunito', sans-serif;
  font-weight: 400;
  font-style: italic;
}


.morecontainer h1{
text-align: left;
  color: black;
}

.morecontainer h4{
  padding-bottom: 40px;


}

.morecontainer h3{
  padding-top: 40px;


}

.morecontainer a{
color: black;
}


/*Small devices (landscape phones, 576px and up)*/
@media (max-width: 576px) {
  .morecontainer h1{
  font-size: 1.8rem;
  padding-top: 30px;
  }

  }




@media (max-width: 820px) {



  .morecontainer{
    padding: 40px;
  }


  .morecontainer h1{
    text-align: left;
  }

  .morecontainer h4{
    padding-bottom: 20px;
    text-align: left;

  }

  .morecontainer p{

  }


}


.gutschein{
    background-color: #F2F2F2;}




    /*Small devices (landscape phones, 576px and up)*/
    @media (max-width: 576px) {
      .gutschein p{
        font-size:0.8rem;
        padding-left: 70px;
        padding-right: 70px;}
     }





.finger{
  height: 100%;
}

@media (max-width: 820px) {

.ausfuellen{
  padding-top: 50px;
  padding-bottom: 50px;
  }

}


.bluebox{
  border: 2px solid #1B87FE;
  padding-top: 20px;
  margin-bottom: 35px;
  margin-top: 35px;
}