*{
  margin:0;
  padding:0;
  text-decoration:none
}
html{
    height: 100%;
    width: 100%;
    scrollbarBG: #FFFFFF;
    thumbBG: #D40000;
}

body {
    background: #FFFFFF;

    font-family: 'Noto Serif', serif;
    color:#454545;

}
.accordion {
  background: none;
  color: #818181;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  outline: none;
  transition: 0.4s;

}
.td {
vertical-align: top;
}
.panel {
  padding: 0 18px;
  display: none;
  background:none;
  overflow: hidden;

}


 .overlay {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1000000;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
  overflow-x: hidden;
  transition: 0.5s;
}

.overlay-content {
  position: relative;
  top: 25%;
  width: 100%;
  text-align: center;
  margin-top: 30px;
}

.overlay a {
  padding: 8px;
  text-decoration: none;
  font-size: 36px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.overlay a:hover, .overlay a:focus {
  color: #f1f1f1;
}

.overlay .closebtn {
  position: absolute;
  top: 20px;
  right: 45px;
  font-size: 60px;
}

.btn:link,
.btn:visited{

  position:relative;
  top:0;
  left:0;
  padding:20px 40px;
  border-radius:100px;
  display:inline-block;
  transition: all .5s;
  text-align: justify;
  box-shadow:0px 3px 3px black;
   transform : translateY(-3px);
   margin-top:20px;
}

.btn-white{
  background:#F0F0F0;
  color:#000;
}

.menue1
{
  font-size:20px;
  cursor:pointer;
  item-align:center;
  text-align:center;
  margin-top:125px;
  margin-right:0px;
  font-weight:600;"
}

.btn:active{
  box-shadow:0px 5px 10px white;
  transform:translateY(-1px);
}

.btn-bottom-animation-1{
  animation:comeFromBottom 1s ease-out .8s;
}

.btn::after{
  content:"";
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  border-radius:100px;
  display:inline-block;
  z-index:-1;
  transition: all .5s;
}

.btn-white::after {
    background: #FFFFFF;
}

.btn-animation-1:hover::after {
    transform: scaleX(1.4) scaleY(1.6);
    opacity: 0;
}

@keyframes comeFromBottom{
  0%{
    opacity:0;
    transform:translateY(40px);
  }
  100%{
    opacity:1;
    transform:translateY(0);
  }
}

.btn2:link,
.btn2:visited{


  position:relative;
  top:0;
  left:0;
  padding:20px 40px;
  border-radius:30px;
  display:inline-block;
  transition: all .5s;
  text-align: justify;
  box-shadow:0px 3px 3px white;
   transform : translateY(-3px);
   margin-top:20px;
}

.btn2-white{
  background:#F0F0F0;
  color:#000;
}



.btn2:active{
  box-shadow:0px 5px 10px white;
  transform:translateY(-1px);
}

.btn2-bottom-animation-1{
  animation:comeFromBottom 1s ease-out .8s;
}

.btn2::after{
  content:"";
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  border-radius:30px;
  display:inline-block;
  z-index:-1;
  transition: all .5s;
}

.btn2-white::after {
    background: #F0F0F0;
}

.btn2-animation-1:hover::after {
    transform: scaleX(1.4) scaleY(1.6);
    opacity: 0;
}


@media screen and (max-height: 450px) {
  .overlay a {font-size: 20px}
  .overlay .closebtn {
  font-size: 40px;
  top: 15px;
  right: 35px;
  }
}

body {
    background: #FFFFFF;
    font-family: '
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif&display=swap');
     color:#454545;

}

}
 sup {
   position: relative;
   vertical-align: baseline;
   top: -0.4em;
}

nav {
    background: #FFFFFF;
    position: relative;
    margin: 0 auto;
}
.navfront {
font-size:30px;
cursor:pointer;

}

#fussbereich {
    position:fixed;
    bottom: 0;
    width: 100%;
    background-color: #F0F0F0;
    color: black;
    height: 2em;
    text-align: center;
    padding-top:10px;
     z-index:75000;
}
.content{
   display: flex;
   align-items: center;
   justify-content: center;
   margin-right:auto;
   margin-left:auto;
   position:relative-top;
   align-content:center;
   align-items:center;

}




.logo {
    z-index: 123;
    padding: 10px;
    color: #FFFFFF;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    -ms-flex-negative: 1;
        flex-shrink: 1;
      margin-left:-11px;

}
.logo2 {
    z-index:123;
    padding: 10px;
    color: #FFFFFF;
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    -ms-flex-negative: 1;
        flex-shrink: 1;

}
.logo a {
    color: #FFFFFF;
}






@media screen and (min-width: 769px) {
  /* Center the logo and remove the bar */
    .bodys {
        width: 80%;
        text-align: center;
    }

     .content {
       z-index:1230;
        width: 60%;
        text-align: left;
    }
     .social-wrapper {

 right:0px;
  -ms-flex-preferred-size:100%;flex-basis:100%;-ms-flex-positive:0;flex-grow:1;-ms-flex-align:center;align-items:center;
 padding:0px;
}

.social-wrapper i {
    padding: 0px 3px;
    color: #171717;
    cursor: pointer;
    transition: all ease-in-out 150ms;
    vertical-align:top;

}



     }

@media screen and (max-width: 768px) {
  /* Center the logo and remove the bar */



  .logo {
      z-index: 123;
      padding: 10px;
      color: #FFFFFF;
      -webkit-box-flex: 1;
          -ms-flex-positive: 1;
              flex-grow: 1;
      -ms-flex-negative: 1;
          flex-shrink: 1;
        margin-left:11px;

  }


.menue1
{
  font-size:20px;
  cursor:pointer;
  item-align:center;
  text-align:center;
  margin-top:125px;
  margin-right:25px;
  font-weight:600;"
}

.schrift {margin-left:20px;
        margin-right:20px;
        overflow:auto;
                            }


}


   .social-wrapper {

 right:0px;
  -ms-flex-preferred-size:100%;
  flex-basis:100%;
  -ms-flex-positive:0;
  flex-grow:1;-ms-flex-align:center;
  align-items:center;
 padding:0px;
}

.social-wrapper i {
    padding: 3px 3px;
    color: #171717;
    cursor: pointer;


}




#facebook {
    color: #000;

}

#twitter {
    color: #000;

}

#instagram {
    color: #000;

}

    #youtube {
    color: #000;

}

#email {
    color: #000;

    }
#facebook:hover {
    color: #4867AA;

}

#youtube:hover {
    color: #FF0000;

}

#twitter:hover {
    color: #1DA1F2;

}

#instagram:hover {
    color: #8a3ab9;

}



#email:hover {
    color: #dd4b39;

}
