.main-img-1{
    position: fixed;
    overflow-x:hidden;
    display: block;
    top: 0px;
    left: 0%;
    height: 1000px;
    width: 100%;
    background-image: url("moschee.webp?v=1");
    background-size: cover;
    transition: 1s all ease-in-out;
    z-index:0.5;
    
    /*background:linear-gradient( rgb(111, 111, 111) ,rgb(245, 245, 245),rgb(153, 153, 153))*/
      }
      .blackpass{
          display: flex;
          position: fixed;
          height: 100%;
          width: 100%;
          top: 0;
          left: 0;
          z-index:1;
          background-color: rgba(0,0,0,0.5);
          backdrop-filter:blur(7px);
          -webkit-backdrop-filter:blur(7px);
      }
      .blackpass img{
            height: 100%;
            width: 100%;
            opacity: 0;
        }
        .fontm{
          font-family: "Trebuchet MS", Helvetica,sans-serif;
          letter-spacing: 0px;
          line-height: 1;
          word-spacing: 2px;
          font-weight: 700;
          text-decoration: none solid rgb(0, 0, 0);
          font-style: normal;
          font-variant: normal;
          text-transform: none;
        }
        .zeiten{
               display:flex;
               position:absolute;
               border: 0px solid white;
               flex-direction:column;
               white-space: pre;
               backdrop-filter:blur(0px);
               -webkit-backdrop-filter:blur(0px);
               background-color:#ff000000;
               top:170px;
               height: 420px;
               width:83%;
               left: 0%;
               justify-content: center;
               align-items:center;
               border-radius: 30px;
               overflow: visible;
               transition: 1s;
               z-index:2;
               border:white 0px solid;
        }
          .zeitenafter{
              width: 90%;
              left: 5%;
             }
            .zitems{
                position:absolute;
                display:flex;
                background-color:#95262600;
                height:90%;
                width:100%;
                top:10%;
                left:0%;
                flex-direction:column;
                justify-content:center;
                align-items:start;
                font-size:70px;
            }
            .allz{
                font-size:27px;
                animation:zeitenspopup 1s,zeitenspopupremove 0.1s,zeitenpopupback 0.6s;
                animation-fill-mode:forwards;
                animation-delay:0.5s,8s,98s;
                background: conic-gradient(white,white,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
                background-position:0% 0;
            }
               @keyframes zeitenspopupremove{
                0% {
                  
                   background-position: -20% 0;
                }
                100%{
                    background-position: -0% 0;
                }
            }
@keyframes zeitenpopupback{
                0% {
                  
                   background-position: -0% 0;
                }
                100%{
                    background-position: -20% 0;
                }
            }
               @keyframes zeitenspopup{
                0% {
                  
                   background-position: -0% 0;
                }
                100%{
                    background-position: -20% 0;
                }
            }
    .fajr{
      position:absolute;
      display:flex;
      height:15%;
      width:100%;
      left:0;
      top:5%;
      background-color:#0000ff00;
    }
   /* .fajr::before{
      content:"";
      position:absolute;
      display:flex;
      height:7%;
      width: 80%;
      left: 22%;
      top: -70%;
      background-color:white;
      animation:removebeforeandaftermain 2s,removeline1 1.5s,linebackm 1s;
      animation-fill-mode:forwards;
      animation-delay:0s,7s,45s;
    }*/
@keyframes removeline1{
                0% {
                  
                   width: 80%;
                }
                100%{
                    width: 0%;
                }
            }
@keyframes linebackm{
                0% {
                  
                   width: 0%;
                }
                100%{
                    width: 80%;
                }
}
               
@keyframes removebeforeandaftermain{
                0% {
                  
                   width: 0%;
                }
                100%{
                    width: 80%;
                }
            }
    @keyframes removebeforeandafter{
                0% {
                  
                   width: 0%;
                }
                100%{
                    width: 97%;
                }
            }
     @keyframes lineback{
                0% {
                  
                   width: 0%;
                }
                100%{
                    width: 97%;
                }
            }
     @keyframes removebeforeandafterremove{
                0% {
                  
                   width: 97%;
                }
                100%{
                    width: 0%;
                }
            }
    .fajro{
      position:absolute;
      display:flex;
      height:100%;
      width:40%;
      left:2%;
      background-color:#ff000000;
      align-items:center;
    }
    .fajr h3{
    }
    
    .fajro h3{
    
    }
    .fajr::after {
      content: '';
      position: absolute;
      display:flex;
      width: 100%;
      height: 5%;
      top: 85%;
      left: 0;
      background-color: white;
      animation:removebeforeandafter 2s,removebeforeandafterremove 1.5s,lineback 1s;
      animation-fill-mode:forwards;
      animation-delay:0s,7s,97.5s;
    }
    .fajrt{
      position:absolute;
      display:flex;
      height:100%;
      width:40%;
      left:45%;
      background-color:#00ff6e00;
      align-items:center;
    }
    .fajrt h3{
    
    }
    .sohar{
      position:absolute;
      display:flex;
      height:15%;
      width:100%;
      left:0;
      top:20%;
      background-color:#0000ff00;
    }
    .sohar h3{
    }
    .soharo{
      position:absolute;
      display:flex;
      height:100%;
      width:40%;
      left:2%;
      background-color:#ff000000;
      align-items:center;
    }
    .soharo h3{
 
    }
    .sohar::after {
      content: '';
      position: absolute;
      display:flex;
      width: 100%;
      height: 5%;
      top: 85%;
      left: 0;
      background-color: white;
      animation:removebeforeandafter 2s,removebeforeandafterremove 1.5s,lineback 1s;
      animation-fill-mode:forwards;
      animation-delay:0s,7s,97.5s;
    }
    .sohart{
      position:absolute;
      display:flex;
      height:100%;
      width:40%;
      left:45%;
      background-color:#00ff6e00;
      align-items:center;
    }
    .sohart h3{

        
    }
    .assr{
      position:absolute;
      display:flex;
      height:15%;
      width:100%;
      left:0;
      top:35%;
      background-color:#0000ff00;
    }
    .assr h3{
    }
    .assro{
      position:absolute;
      display:flex;
      height:100%;
      width:40%;
      left:2%;
      background-color:#ff000000;
      align-items:center;
    }
    .assro h3{
  
    }
    .assr::after {
      content: '';
      position: absolute;
      display:flex;
      width: 100%;
      height: 5%;
      top: 85%;
      left: 0;
      background-color: white;
      animation:removebeforeandafter 2s,removebeforeandafterremove 1.5s,lineback 1s;
      animation-fill-mode:forwards;
      animation-delay:0s,7s,97.5s;
    }
    .assrt{
      position:absolute;
      display:flex;
      height:100%;
      width:40%;
      left:45%;
      background-color:#00ff6e00;
      align-items:center;
    }
    .assrt h3{
 
    }
    .maghrib{
      position:absolute;
      display:flex;
      height:15%;
      width:100%;
      left:0;
      top:50%;
      background-color:#0000ff00;
    }
    .maghrib h3{
    }
    .maghribo{
      position:absolute;
      display:flex;
      height:100%;
      width:40%;
      left:2%;
      background-color:#ff000000;
      align-items:center;
    }
    .maghribo h3{

    }
    .maghrib::after {
      content: '';
      position: absolute;
      display:flex;
      width: 100%;
      height: 5%;
      top: 85%;
      left: 0;
      background-color: white;
      animation:removebeforeandafter 2s,removebeforeandafterremove 1.5s,lineback 1s;
      animation-fill-mode:forwards;
      animation-delay:0s,7s,97.5s;
    }
    .maghribt{
      position:absolute;
      display:flex;
      height:100%;
      width:40%;
      left:45%;
      background-color:#00ff6e00;
      align-items:center;
    }
    .maghribt h3{
   
    }
    .isha{
      position:absolute;
      display:flex;
      height:15%;
      width:100%;
      left:0;
      top:65%;
      background-color:#0000ff00;
    }
    .isha h3{
    }
    .ishao{
      position:absolute;
      display:flex;
      height:100%;
      width:40%;
      left:2%;
      background-color:#ff000000;
      align-items:center;
    }
    .ishao h3{

    }
    .isha::after {
      content: '';
      position: absolute;
      display:flex;
      width: 100%;
      height: 5%;
      top: 85%;
      left: 0;
      background-color: white;
      animation:removebeforeandafter 2s,removebeforeandafterremove 1.5s,lineback 1s;
      animation-fill-mode:forwards;
      animation-delay:0s,7s,97.5s;
    }
    .ishat{
      position:absolute;
      display:flex;
      height:100%;
      width:40%;
      left:45%;
      background-color:#00ff6e00;
      align-items:center;
    }
    .ishat h3{
    
    }
    .freitag{
      position:absolute;
      display:flex;
      height:15%;
      width:100%;
      left:0;
      top:80%;
      background-color:#0000ff00;
    }
    .freitag h3{
    }
    .freitago{
      position:absolute;
      display:flex;
      height:100%;
      width:40%;
      left:2%;
      background-color:#ff000000;
      align-items:center;
    }
    .freitago h3{

    }
    .freitag::after {
      content: '';
      position: absolute;
      display:flex;
      width: 100%;
      height: 5%;
      top: 85%;
      left: 0;
      background-color: white;
      animation:removebeforeandafter 2s,removebeforeandafterremove 1.5s,lineback 1s;
      animation-fill-mode:forwards;
      animation-delay:0s,7s,97.5s;
    }
    .freitagt{
      position:absolute;
      display:flex;
      height:100%;
      width:40%;
      left:55%;
      background-color:#00ff6e00;
      align-items:center;
    }
    .freitagt h3{

    }
    .white-rectangle {
                display: flex;
                position: fixed;
                height: 150px;
                width: 100%;
                left: 1.5%;
                top: 50px;
                background-color: #66626200;
                justify-content: center;
                align-items: center;
                animation: wwtext 0.1s linear;
                animation-delay: 1.3s;
                animation-fill-mode: forwards;
                z-index:1;
                /*box-shadow: 0 0 5px rgb(255, 0, 242),
                  0 0 25px rgb(255, 0, 242),
                  0 0 50px rgb(255, 0, 242),
                  0 0 1000px rgb(255, 0, 242);
              */
                }
                 
              @keyframes bodyanim{
                0%{
                  opacity: 0;
                }
                100%{
                  opacity: 1;
                }
              }
              .wtext {   
                font-size: 39px;
                text-align: center;
                background: 
                conic-gradient(rgb(255, 255, 255),rgb(255, 255, 255), rgb(255, 255, 255),transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
                transition: 1s all ease-in-out;
                animation: logoanim 2s,logoanimremove 1.5s,logoback 1s;
                animation-fill-mode:forwards;
                animation-delay:0s,7s,97.5s;
              }
              @keyframes logoanimremove {
                0% {
                  
                   background-position:  -30% 0;
                }
                100% {
                    background-position: -0% 0;
                }
            }
              @keyframes logoanim {
                0% {
                  
                   background-position:  0% 0;
                }
                100% {
                    background-position: -30% 0;
                }
            }
          @keyframes logoback{
                0% {
                  
                   background-position:  0% 0;
                }
                100% {
                    background-position: -30% 0;
                }
            }
            .akterminepg{
                position:fixed;
                display:flex;
                height:1000px;
                top:0;
                left:0;
                width:100%;
                border:0px solid #feedbd;
                clip-path: circle(50px at 90% -20%);
                -webkit-clip-path: circle(50px at 90% -10%);
                transition: all 0.4s ease-out;
                pointer-events: none;
                animation:popupakt 1s,popuaktremove 1s;
                animation-fill-mode:forwards;
                animation-delay:8.5s,15s;
                z-index:2;
                background-color: rgba(0, 0, 0, 0.5);
                backdrop-filter:blur(10px);
                -webkit-backdrop-filter:blur(10px);
            }
            @keyframes popupakt{
                0%{
                    
                }
                100%{
                    clip-path: circle(1000px at 90% -10%);
                    -webkit-clip-path: circle(1100px at 90% -10%);
                    pointer-events: all;
            }
            }
            @keyframes popuaktremove{
                0%{
                    
                }
                100%{
                    clip-path: circle(1000px at 0% 100%);
                    -webkit-clip-path: circle(50px at 0% 100%);
                    pointer-events: all;
            }
            }
            .akto{
                position:absolute;
                display:flex;
                height: 10%;
                width: 100%;
                left: 0%;
                top:3%;
                justify-content:center;
                align-items:center;
                background-color: #7b222200;
                text-align:center;
            }
            .akto h1{
                text-align:center;
                font-size: 45px;
                background: conic-gradient(#ff92a5,#ff9faf,transparent,transparent);
                background-clip: text;
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
                background-position:0% 0;
                animation:aftertext 2s;
                animation-fill-mode:forwards;
                animation-delay:9s;
            }
            @keyframes aftertext{
                0%{
                    background-position:0% 0;
                }
                100%{
                    background-position:-30% 0;
                }
            }
            .aktuellp1{
      position: absolute;
      display: flex;
      height: 16%;
      width: 72%;
      top:16%;
      left:5%;
      background-color: transparent;
          backdrop-filter:blur(10px);
	      -webkit-backdrop-filter:blur(10px);
      z-index:1;
      border-radius:10px;
      transition: 1s;
      overflow:hidden;
      }
.aktuellp1::before{
    content:"";
    position:absolute;
    display:flex;
    height:100%;
    width:100%;
    z-index:1;
    background:linear-gradient(120deg,transparent,transparent,#000000b8,black)
}
      .aktuellp1 img{
          filter:blur(0px);
          width:100%;
          height:100%;
      }
    .aktuellp1 a{
          color: #ffc68c;  
          font-family: "Trebuchet MS", Helvetica,sans-serif;
          letter-spacing: 0px;
          line-height: 1;
          word-spacing: 2px;
          font-weight: 700;
          text-decoration: none solid rgb(0, 0, 0);
          font-style: normal;
          font-variant: normal;
    text-transform: none
    }
.mainakps{
    position:absolute;
    display:flex;
    height:45%;
    width:70%;
    background-color:#a0131300;
    top:55%;
    left:37%;
    border-top-right-radius:40px;
    backdrop-filter:blur(0px);
    z-index:1;
}
    .mainakp1{
        position: absolute;
        display: flex;
        height: 30%;
        width: 90%;
        left:2%;
        top:60%;
        align-items:center;
        justify-content:start;
        background-color:#1ba62800;
        font-size:23px;
        text-decoration:none;
    }
    .mainakp2{
        position: absolute;
        display: flex;
        height: 70%;
        width: 90%;
        left:2%;
        top: 2%;
        justify-content:start;
        align-items:center;
        background-color: #695f0d00;
        font-size:27px;
    }
.aktuellp2{
      position: absolute;
      display: flex;
      height: 16%;
      width: 72%;
      top:54%;
      left:5%;
      background-color: #feedbd;
          backdrop-filter:blur(0px);
	      -webkit-backdrop-filter:blur(0px);
      z-index:1;
      border-radius:10px;
      transition: 1s;
      overflow:hidden;
      }
.aktuellp2::before{
    content:"";
    position:absolute;
    display:flex;
    height:100%;
    width:100%;
    z-index:1;
    background: linear-gradient(50deg,#000000,#00000069,transparent,transparent);
}
      .aktuellp2 img{
          filter:blur(0px);
          width:100%;
          height:100%;
      }
    .aktuellp21 a{ 
          font-family: "Trebuchet MS", Helvetica,sans-serif;
          letter-spacing: 0px;
          line-height: 1;
          word-spacing: 2px;
          font-weight: 700;
          text-decoration: none solid rgb(0, 0, 0);
          font-style: normal;
          font-variant: normal;
    text-transform: none
    }
.mainakps2{
    position:absolute;
    display:flex;
    height:50%;
    width:80%;
    background-color:#a0131300;
    top:55%;
    left:0;
    border-top-right-radius:40px;
    backdrop-filter:blur(0px);
    z-index:1;
}
    .mainakp21{
        position: absolute;
        display: flex;
        height: 30%;
        width: 75%;
        left:2%;
        top:45%;
        align-items:center;
        justify-content:start;
        background-color:#1ba62800;
        font-size:23px;
        text-decoration:none;
    }
.mainakp21 a{
    line-height:1.2rem;
    color:#ffc68c;
}
    .mainakp22{
        position: absolute;
        display: flex;
        height: 70%;
        width: 100%;
        left:2%;
        top: -20%;
        justify-content:start;
        align-items:center;
        background-color: #695f0d00;
        font-size:30px;
    }
    .mainakp22 a{
        color:#ffc68c;
    }
            .aktuellp4{
          position: absolute;
           height: 16%;
           width: 72%;
          top:35%;
          left:5%;
          background:linear-gradient(90deg, #ffd3f0, #ffe6bc);
          backdrop-filter:blur(10px);
          -webkit-backdrop-filter:blur(10px);
          z-index:1;
          border-radius:10px;
          transition: 1s;
          overflow:hidden;
      }
.aktuellp4::before{
    content:"";
    position:absolute;
    display:flex;
    height:100%;
    width:100%;
    z-index:1;
    background:linear-gradient(120deg,transparent,transparent,#000000b8,black)
}
      .aktuellp4 img{
          filter:blur(0px);
          width:100%;
          height:100%;
      }
    .aktuellp4 a{
          color: #ffc68c;  
          font-family: "Trebuchet MS", Helvetica,sans-serif;
          letter-spacing: 0px;
          line-height: 1;
          word-spacing: 2px;
          font-weight: 700;
          text-decoration: none solid rgb(0, 0, 0);
          font-style: normal;
          font-variant: normal;
    text-transform: none;
        background: conic-gradient(#ffffff,#ffffff,transparent,transparent);
            background-clip: text;
            -webkit-background-clip: text;
            background-size: 2000px 1px;
        background-position:-30% 0;
    }
.mainakps4{
    position:absolute;
    display:flex;
    height:45%;
    width:70%;
    background-color:#a0131300;
    top:55%;
    left:37%;
    border-top-right-radius:40px;
    backdrop-filter:blur(0px);
    z-index:4;
}
    .mainakp41{
        position: absolute;
        display: flex;
        height: 30%;
        width: 90%;
        left:2%;
        top:60%;
        align-items:center;
        justify-content:start;
        background-color:#1ba62800;
        font-size:23px;
        text-decoration:none;
    }
    .mainakp42{
        position: absolute;
        display: flex;
        height: 70%;
        width: 90%;
        left:2%;
        top: 2%;
        justify-content:start;
        align-items:center;
        background-color: #695f0d00;
        font-size:29px;
    }
.zitat{
    position:absolute;
    display:flex;
    height:600px;
    width:100%;
    left:0%;
    top:5%;
    background-color:#ff000000;
    z-index:1;
}
.zitato{
    position:absolute;
    display:flex;
    height:15%;
    width:80%;
    left:3%;
    top:-5%;
    background-color:#0030fb00;
    z-index:1;
    justify-content:start;
    align-items:start;
}
.zitato h1{
        background: conic-gradient(#ff9dae,#ff9dae,transparent,transparent);
                background-clip: text;
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
                background-position:-0% 0;
    font-size:37px;
    animation:zitatoback 2s,zitatoremove 2s;
    animation-fill-mode:forwards;
    animation-delay:16s,28s;
}
@keyframes zitatoback{
    0%{
        
    }
    100%{
        background-position:-30% 0;
    }
}
@keyframes zitatoremove{
    0%{
        background-position:-30% 0;
    }
    100%{
        background-position:-0% 0;
    }
}
.zitatm{
    position:absolute;
    display:flex;
    height:60%;
    width:95%;
    left:2.5%;
    top:5%;
    background-color:#00ff7700;
    z-index:1;
    justify-content:start;
    align-items:center;
}
.zitatm h1{
    line-height:1.2;
    font-size:25px;
    background: conic-gradient(#ffffffb0,#ffffffb0,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
                background-position:-0% 0;
}
.zitatm h1 .zt{
    background: conic-gradient(#ffffffb0,#ffffffb0,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
    background-size: 2000px 1px;
    background-position:-0% 0;
    animation:ztback 1s,zitatmremove 0.5s;
    animation-fill-mode:forwards;
    animation-delay:16.5s,29s
}
@keyframes ztback{
    0%{
        background-position:-0% 0;
    }
    100%{
        background-position:-35% 0;
    }
}
.zitatm h1 .zt2{
    background: conic-gradient(#ffffffb0,#ffffffb0,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
    background-size: 2000px 1px;
    background-position:-0% 0;
    animation:ztback 1s,zitatmremove 0.5s;
    animation-fill-mode:forwards;
    animation-delay:17s,29s;
}
.zitatm h1 .zt3{
    background: conic-gradient(#ffffffb0,#ffffffb0,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
    background-size: 2000px 1px;
    background-position:-0% 0;
    animation:ztback 1s,zitatmremove 0.5s;
    animation-fill-mode:forwards;
    animation-delay:17.5s,29s;
}
.zitatm h1 .zt4{
    background: conic-gradient(#ffffffb0,#ffffffb0,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
    background-size: 2000px 1px;
    background-position:-0% 0;
    animation:ztback 1s,zitatmremove 0.5s;
    animation-fill-mode:forwards;
    animation-delay:18s,29s;
}
.zitatm h1 .zt5{
    background: conic-gradient(#ffffffb0,#ffffffb0,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
    background-size: 2000px 1px;
    background-position:-0% 0;
    animation:ztback 1s,zitatmremove 0.5s;
    animation-fill-mode:forwards;
    animation-delay:18.5s,29s;
}
.zitatm h1 .zt6{
    background: conic-gradient(#ffffffb0,#ffffffb0,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
    background-size: 2000px 1px;
    background-position:-0% 0;
    animation:ztback 1s,zitatmremove 0.5s;
    animation-fill-mode:forwards;
    animation-delay:19s,29s;
}
.zitatm h1 .zt7{
    background: conic-gradient(#ffffffb0,#ffffffb0,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
    background-size: 2000px 1px;
    background-position:-0% 0;
    animation:ztback 1s,zitatmremove 0.5s;
    animation-fill-mode:forwards;
    animation-delay:19.5s,29s;
}
.zitatm h1 .zt8{
    background: conic-gradient(#ffffffb0,#ffffffb0,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
    background-size: 7000px 1px;
    background-position:-0% 0;
    animation:ztback 1s,zitatmremove 0.5s;
    animation-fill-mode:forwards;
    animation-delay:19.5s,29s;
}
@keyframes zitatmremove{
    0%{
        background-position:-35% 0;
    }
    100%{
        background-position:-0% 0;
    }
}
.zitatm h1::after{
    content:"";
    position:absolute;
    display:flex;
    height:0.7%;
    width:0%;
    background-color:white;
    top:96%;
    left:5%;
    animation:zitatline 2s,zitatlineremove 2s;
    animation-fill-mode:forwards;
    animation-delay:16s,28s;
}

@keyframes zitatline{
    0%{
        width:0%;
    }
    100%{
        width:90%;
    }
}
@keyframes zitatlineremove{
    0%{
        width:90%;
    }
    100%{
        width:0%;
    }
}
.zitatmurdu{
    position:absolute;
    display:flex;
    height:60%;
    width:95%;
    left:2.5%;
    top:53%;
    background-color:#00ff7700;
    z-index:1;
    justify-content:start;
    align-items:center;
}
.zitatmurdu h1{
    line-height:1.2;
    font-size:25px;
    background: conic-gradient(#ffffffb0,#ffffffd1,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
   background-position:-0% 0;
    animation:zitaturduback 1s,zitaturdubackremove 0.5s;
    animation-fill-mode:forwards;
    animation-delay:20s,29s;
}
@keyframes zitaturduback{
    0%{
        background-position:-0% 0;
    }
    100%{
        background-position:100% 0;
    }
}

@keyframes zitaturdubackremove{
    0%{
        background-position:100% 0;
    }
    100%{
        background-position:0% 0;
    }
}
.zitata{
    position:absolute;
    display:flex;
    height:15%;
    width:70%;
    left:3%;
    top:100%;
    background-color:#ffffff00;
    z-index:1;
    justify-content:start;
    align-items:center;
}
.zitata h1{
    font-family: "Comic Sans MS", cursive, sans-serif;
letter-spacing: 0.2px;
word-spacing: 0px;
color: transparent;
font-weight: 700;
text-decoration: none;
font-style: italic;
font-variant: normal;
text-transform: none;
    font-size:27px;
   background: conic-gradient(#ff9dae,#ff9cad,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
   background-position:-0% 0;
  animation:zitata 2s,zitataremove 2s;
    animation-fill-mode:forwards;
    animation-delay:21s,28s;
}
@keyframes zitata{
    0%{
        background-position:-0% 0;
    }
    100%{
        background-position:-30% 0;
    }
}
@keyframes zitataremove{
    0%{
        background-position:-30% 0;
    }
    100%{
        background-position:-0% 0;
    }
}
.zitata h1 .as{
    position:absolute;
    display:flex;
    font-size:15px;
    top:50%;
    left:39%;
   background: conic-gradient(#feedbd,#feedbd,transparent,transparent);
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
   background-position:-0% 0;
   animation:zitata 2s,zitataremove 2s;
    animation-fill-mode:forwards;
    animation-delay:22s,28s;
}
.wichtigtermine{
    position:fixed;
    display:flex;
    height:800px;
    width:100%;
    left:0;
    top:0px;
    background-color:#ffffff00;
    z-index:1;
    justify-content:start;
    align-items:center;
    clip-path: circle(50px at 90% -20%);
    -webkit-clip-path: circle(1000px at 90% -10%);
    transition: all 0.4s ease-out;
    pointer-events: none;
}
.termin1{
    position:absolute;
    display:flex;
    height:100%;
    width:100%;
    top:0;
    left:0;
    
}
.terminoo{
    position:absolute;
    display:flex;
    height:10%;
    width:100%;
    top:20%;
    left:0;
    background-color:#1addbd00;
    justify-content:center;
    align-items:center;
    text-align:center;
}
.terminoo h1{
    text-align:center;
    background: conic-gradient(#8c0101,#dee765,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
   background-position:-0% 0;
    animation:terminoo 1s,terminooremove 1s;
    animation-fill-mode:forwards;
    animation-delay:30s,37s;
}
@keyframes terminoo{
    0%{
        background-position:-0% 0;
    }
    100%{
        background-position:-30% 0;
    }
}
@keyframes terminooremove{
    0%{
        background-position:-30% 0;
    }
    100%{
        background-position:0% 0;
    }
}
.terminoo h1 a{
    text-align:center;
    background: conic-gradient(#616161,#ffffff,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
   background-position:-0% 0;
     animation:terminoo 1s,terminooremove 1s;
    animation-fill-mode:forwards;
    animation-delay:30s,37s;
}
.terminmo{
    position:absolute;
    display:flex;
    height:30%;
    width:100%;
    top:24%;
    left:0;
    background-color:#ff000000;
    justify-content:start;
    align-items:center;
}
.terminmo h1{
    line-height:4.5rem;
    font-size:55px;
    text-align:center;
    background: conic-gradient(#8c0101,#dee765,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
   background-position:-0% 0;
   animation:terminmo 1.5s,terminmremove 1.5s;
    animation-fill-mode:forwards;
    animation-delay:30.5s,37.5s
}
@keyframes terminmo{
    0%{
        background-position:0% 0;
    }
    100%{
        background-position:-30% 0;
    }
}
@keyframes terminmremove{
    0%{
        background-position:-30% 0;
    }
    100%{
        background-position:0% 0;
    }
}
.terminao{
    position:absolute;
    display:flex;
    height:10%;
    width:100%;
    top:47%;
    left:0;
    background-color:#1addbd00;
    justify-content:center;
    align-items:center;
    text-align:center;
}
.terminao h1{
    text-align:center;
    background: conic-gradient(#616161,#ffffff,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
   background-position:-0% 0;
    animation:terminoo 1s,terminooremove 1s;
    animation-fill-mode:forwards;
    animation-delay:30s,37s;
}
.terminao h1 a{
    text-align:center;
    background: conic-gradient(#8c0101,#dee765,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
   background-position:-0% 0;
    animation:terminoo 1s,terminooremove 1s;
    animation-fill-mode:forwards;
    animation-delay:30s,37s;
}
.termin1ao{
    position:absolute;
    display:flex;
    height:10%;
    width:90%;
    left:5%;
    top:57%;
    background-color:#5b1add00;
    justify-content:center;
    align-items:center;
    text-align:center;
}
.termin1ao h1{
    line-height:3rem;
    font-size:30px;
    text-align:center;
    background: conic-gradient(#616161,#ffffff,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
   background-position:-0% 0;
    animation:terminoo 1s,terminooremove 1s;
    animation-fill-mode:forwards;
    animation-delay:30s,37s;
}
.termin2{
    position:absolute;
    display:flex;
    height:100%;
    width:100%;
    top:0;
    left:0;
     clip-path: circle(50px at 90% -20%);
    -webkit-clip-path: circle(50px at 90% -10%);
    transition: all 0.4s ease-out;
    pointer-events: none;
    animation:termin2 1s;
    animation-fill-mode:forwards;
    animation-delay:38s;
}
@keyframes termin2{
    0%{
        
    }
    100%{
        clip-path: circle(50px at 90% -20%);
    -webkit-clip-path: circle(1000px at 90% -10%);
    transition: all 0.4s ease-out;
    pointer-events: all;
    }
}
.termin2o{
 position:absolute;
    display:flex;
    height:20%;
    width:100%;
    left:0;
    top:15%;
    background-color:#0000ff00;
    justify-content:center;
    align-items:center;
}
.termin2o h1{
    text-align:center;
    line-height:5rem;
font-size:60px;
     background: conic-gradient(#ffc68c,#ffc68c,transparent,transparent);
            background-clip: text;
            -webkit-background-clip: text;
            color: transparent;
            background-size: 2000px 1px;
    animation:msganim 3s,mmsgremove 1.5s;
    animation-fill-mode:forwards;
    animation-delay:38.5s,43.5s;
    
}
@keyframes msganim{
    0%{
        background-position:0 0;
    }
    100%{
        background-position:-30% 0;
    }
}
@keyframes mmsgremove{
    0%{
        background-position:-30% 0;
    }
    100%{
        background-position:0% 0;
    }
}
.termin2ao{
    position:absolute;
    display:flex;
    height:15%;
    width:100%;
    left:0;
    top:35%;
    background-color:#0404f300;
    justify-content:center;
    align-items:center;
}
.termin2ao h1{
    background: conic-gradient(#ffffff,#ffffffcc,transparent,transparent);
            background-clip: text;
            -webkit-background-clip: text;
            color: transparent;
            background-size: 2000px 1px;
    background-position:0 0;
     animation:smsganim 1s,mmsgremove 1.5s;
    animation-fill-mode:forwards;
    animation-delay:38.5s,43.5s;
}
@keyframes smsganim{
    0%{
        background-position:0 0;
    }
    100%{
        background-position:-30% 0;
    }

}
.termin2ao1{
    position:absolute;
    display:flex;
    height:15%;
    width:100%;
    left:0;
    top:43%;
    background-color:#0404f300;
    justify-content:center;
    align-items:center;
    text-align:center;
}
.termin2ao1 h1{
    background: conic-gradient(#ffffff,#ffffffcc,transparent,transparent);
            background-clip: text;
            -webkit-background-clip: text;
            color: transparent;
            background-size: 2000px 1px;
    background-position:0 0;
    animation:smsganim 1s,mmsgremove 1.5s;
    animation-fill-mode:forwards;
    animation-delay:38.5s,43.5s;
}
.termin2ao1 h1 .waitmain{
    background: conic-gradient(#ffc68c,#ffc68c,transparent,transparent);
            background-clip: text;
            -webkit-background-clip: text;
            color: transparent;
            background-size: 2700px 1px;
    background-position:0 0;
     animation:smsganim 1s,mmsgremove 1.5s;
    animation-fill-mode:forwards;
    animation-delay:38.5s,43.5s;
}
.termin2ao2{
    position:absolute;
    display:flex;
    height:15%;
    width:100%;
    left:0;
    top:55%;
    background-color:#0404f300;
    justify-content:center;
    align-items:center;
    text-align:center;
}
.termin2ao2 h1{
    background: conic-gradient(#ffffff,#ffffffcc,transparent,transparent);
            background-clip: text;
            -webkit-background-clip: text;
            color: transparent;
            background-size: 2000px 1px;
    background-position:0 0;
     animation:smsganim 1s,mmsgremove 1.5s;
    animation-fill-mode:forwards;
    animation-delay:38.5s,43.5s;
}
.frage{
                position:fixed;
                display:flex;
                height:1000px;
                top:0;
                left:0;
                width:100%;
                border:0px solid #feedbd;
               background-color:transparent;
    z-index:2;
            }
 .frageo{
                position:absolute;
                display:flex;
                height: 10%;
                width: 100%;
                left: 0%;
                top:3%;
                justify-content:center;
                align-items:center;
                background-color: #7b222200;
                text-align:center;
            }
            .frageo h1{
                text-align:center;
                font-size: 45px;
                background: conic-gradient(#669df6,#1a73e8,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
                background-position:0% 0;
                animation:frageo 2s,frageoremove 1s;
                animation-fill-mode:forwards;
                animation-delay:30s,43s;
            }
            @keyframes frageo{
                0%{
                    background-position:0% 0;
                }
                100%{
                    background-position:-30% 0;
                }
            }
@keyframes frageoremove{
                0%{
                    background-position:-30% 0;
                }
                100%{
                    background-position:-0% 0;
                }
            }
.fraget{
    position:absolute;
    display:flex;
    height:10%;
    width:90%;
    left:5%;
    top:55%;
    background-color:#00000000;
    justify-content:center;
    align-items:center;
}
.fraget h1{
   font-size:30px; 
    background: conic-gradient(#ffffff,#ffffff,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
                background-position:0% 0;
                animation:frageo 2s,frageoremove 1s;
                animation-fill-mode:forwards;
                animation-delay:30s,43s;
}
.fraget h1 a{
   font-size:30px; 
    background: conic-gradient(#669df6,#1a73e8,transparent,transparent);
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
                background-position:0% 0;
                animation:frageo 2s,frageoremove 1s;
                animation-fill-mode:forwards;
                animation-delay:30s,43s;
}
.qr{
    position:absolute;
    display:flex;
    height:20%;
    width:45%;
    left:27.5%;
    top:25%;
    border-radius:30px;
    overflow:hidden;
    animation:qr 0.2s,qrremove 1s;
    animation-fill-mode:forwards;
    animation-delay:30s,43.5s;
    opacity:0;
    background-color:white;
}
@keyframes qr{
                0%{
                   opacity:0;
                    
                }
                100%{
                    opacity:1;
                }
            }
@keyframes qrremove{
                0%{
                    opacity:1;
                }
                100%{
                    opacity:0;
                }
            }
.qr img{
    transform:scale(0.95);
    height:100%;
    width:100%;
}
.proimgs{
                position:fixed;
                display:flex;
                height:1000px;
                top:0;
                left:0;
                width:100%;
                border:0px solid #feedbd;
                clip-path: circle(50px at 90% -20%);
                -webkit-clip-path: circle(50px at 90% -10%);
                transition: all 0.4s ease-out;
                pointer-events: none;
                animation:proimgs 1s,proimgsre 1s;
                animation-fill-mode:forwards;
                animation-delay:44.5s,71s;
                z-index:2;
                background-color: rgba(0, 0, 0, 0.5);
                backdrop-filter:blur(10px);
                -webkit-backdrop-filter:blur(10px);
            }
            @keyframes proimgs{
                0%{
                    
                }
                100%{
                    clip-path: circle(1000px at 90% -10%);
                    -webkit-clip-path: circle(1100px at 90% -10%);
                    pointer-events: all;
            }
            }
            @keyframes proimgsre{
                0%{
                    
                }
                100%{
                    clip-path: circle(1000px at 0% 100%);
                    -webkit-clip-path: circle(50px at 0% 100%);
                    pointer-events: all;
            }
            }
            .pmo{
                position:absolute;
                display:flex;
                height: 10%;
                width: 90%;
                left: 5%;
                top:3%;
                justify-content:center;
                align-items:center;
                background-color: transparent;
                text-align:center;
            }
            .pmo h1{
                text-align:center;
                line-height:3.3rem;
                font-size: 42px;
                background: conic-gradient(#ff92a5,#ff9faf,transparent,transparent);
                background-clip: text;
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
                background-position:0% 0;
                animation:aftertext 2s;
                animation-fill-mode:forwards;
                animation-delay:45.5s;
            }
            @keyframes aftertext{
                0%{
                    background-position:0% 0;
                }
                100%{
                    background-position:-30% 0;
                }
            }
.pimg1{
    position:absolute;
    display:flex;
    height:25%;
    width:60%;
    top:15%;
    left:5%;
    background-color:#09ff00;
    animation:img1a2 1s,img1a2re 1s;
    animation-fill-mode:forwards;
    animation-delay:46s,54s;
    transform:scale(1);
    opacity:0;
    border-radius:50%;
    overflow:hidden;
    background-image:url("pm1.jpg");
    background-size:cover;
}
.pimg2{
    position:absolute;
    display:flex;
    height:25%;
    width:60%;
    top:42%;
    left:35%;
    border-radius:50%;
    background-color:red;
    animation:img1a2 1s,img1a2re 1s;
    animation-fill-mode:forwards;
    animation-delay:46s,54s;
    transform:scale(1);
    opacity:0;
    background-image:url("pm2.jpg?v=3");
    background-size:cover;
    overflow:hidden;
}
.pimg3{
    position:absolute;
    display:flex;
    height:25%;
    width:60%;
    top:15%;
    left:5%;
    background-color:#09ff00;
    animation:img1a2 1s,img1a2re 1s;
    animation-fill-mode:forwards;
    animation-delay:55s,62s;
    transform:scale(1);
    opacity:0;
    border-radius:50%;
    background-image:url("pm3.jpg");
    background-size:cover;
    overflow:hidden;
}
.pimg4{
    position:absolute;
    display:flex;
    height:25%;
    width:60%;
    top:42%;
    left:35%;
    border-radius:50%;
    background-image:url("pm4.webp?v=1");
    background-size:cover;
    background-color:red;
    animation:img1a2 1s,img1a2re 1s;
    animation-fill-mode:forwards;
    animation-delay:55s,62s;
    transform:scale(1);
    opacity:0;
    overflow:hidden;
}
.pimg5{
    position:absolute;
    display:flex;
    height:25%;
    width:60%;
    top:15%;
    left:5%;
    background-image:url("pm5.jpg?v=1");
    background-size:cover;
    background-color:#09ff00;
    animation:img1a2 1s,img1a2re 1s;
    animation-fill-mode:forwards;
    animation-delay:63s,70s;
    transform:scale(1);
    opacity:0;
    border-radius:50%;
    overflow:hidden;
    object-fit:cover;
}
.pimg6{
    position:absolute;
    display:flex;
    height:25%;
    width:60%;
    top:42%;
    left:35%;
    border-radius:50%;
    background-image:url("pm6.jpg?v=2");
    background-size:cover;
    background-color:red;
    animation:img1a2 1s,img1a2re 1s;
    animation-fill-mode:forwards;
    animation-delay:63s,70s;
    transform:scale(1);
    opacity:0;
    overflow:hidden;
}

@keyframes img1a2{
    0%{
        
    }
    100%{
        opacity:1;
    }
}
@keyframes img1a2re{
    0%{
        
    }
    100%{
        opacity:0;
    }
}
.emmain{
      position:fixed;
                display:flex;
                height:1000px;
                top:0;
                left:0;
                width:100%;
                border:0px solid #feedbd;
                clip-path: circle(50px at 90% -20%);
                -webkit-clip-path: circle(50px at 90% -10%);
                transition: all 0.4s ease-out;
                pointer-events: none;
                animation:em 1s,emre 1s;
                animation-fill-mode:forwards;
                animation-delay:71s,96s;
                z-index:2;
                background-color: rgba(0, 0, 0, 0.5);
                backdrop-filter:blur(10px);
                -webkit-backdrop-filter:blur(10px);
            }
            @keyframes em{
                0%{
                    
                }
                100%{
                    clip-path: circle(1000px at 90% -10%);
                    -webkit-clip-path: circle(1100px at 90% -10%);
                    pointer-events: all;
            }
            }
            @keyframes emre{
                0%{
                    
                }
                100%{
                    clip-path: circle(1000px at 0% 100%);
                    -webkit-clip-path: circle(50px at 0% 100%);
                    pointer-events: all;
            }
            }
            .emo{
                position:absolute;
                display:flex;
                height: 10%;
                width: 90%;
                left: 5%;
                top:3%;
                justify-content:center;
                align-items:center;
                background-color: transparent;
                text-align:center;
            }
            .emo h1{
                text-align:center;
                line-height:3.3rem;
                font-size: 42px;
                background: conic-gradient(#ff92a5,#ff9faf,transparent,transparent);
                background-clip: text;
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
                background-size: 2000px 1px;
                background-position:0% 0;
                animation:aftertext 2s;
                animation-fill-mode:forwards;
                animation-delay:71.5s;
            }
            @keyframes aftertext{
                0%{
                    background-position:0% 0;
                }
                100%{
                    background-position:-30% 0;
                }
            }
.em1{
    position:absolute;
    display:flex;
    height:25%;
    width:60%;
    top:15%;
    left:5%;
    background-color:#09ff00;
    animation:emi 1s,emire 1s;
    animation-fill-mode:forwards;
    animation-delay:72s,79s;
    transform:scale(1);
    opacity:0;
    border-radius:50%;
    overflow:hidden;
    background-image:url("em1.jpeg");
    background-size:cover;
}
.em2{
    position:absolute;
    display:flex;
    height:25%;
    width:60%;
    top:42%;
    left:35%;
    border-radius:50%;
    background-color:red;
    animation:emi 1s,emire 1s;
    animation-fill-mode:forwards;
    animation-delay:72s,79s;
    transform:scale(1);
    opacity:0;
    background-image:url("em2.jpeg");
    background-size:cover;
    overflow:hidden;
}
.em3{
    position:absolute;
    display:flex;
    height:25%;
    width:60%;
    top:15%;
    left:5%;
    background-color:#09ff00;
    animation:emi 1s,emire 1s;
    animation-fill-mode:forwards;
    animation-delay:80s,87s;
    transform:scale(1);
    opacity:0;
    border-radius:50%;
    background-image:url("em3.jpeg");
    background-size:cover;
    overflow:hidden;
}
.em4{
    position:absolute;
    display:flex;
    height:25%;
    width:60%;
    top:42%;
    left:35%;
    border-radius:50%;
    background-image:url("em4.jpeg");
    background-size:cover;
    background-color:red;
    animation:emi 1s,emire 1s;
    animation-fill-mode:forwards;
    animation-delay:80s,87s;
    transform:scale(1);
    opacity:0;
    overflow:hidden;
}
.em5{
    position:absolute;
    display:flex;
    height:25%;
    width:60%;
    top:15%;
    left:5%;
    background-image:url("em6.jpeg");
    background-size:cover;
    background-color:#09ff00;
    animation:emi 1s,emire 1s;
    animation-fill-mode:forwards;
    animation-delay:88s,95s;
    transform:scale(1);
    opacity:0;
    border-radius:50%;
    overflow:hidden;
    object-fit:cover;
}
.em6{
    position:absolute;
    display:flex;
    height:23%;
    width:95%;
    top:45%;
    left:2.5%;
    border-radius:20px;
    background-repeat:no-repeat;
    background-color:red;
    animation:emi 1s,emire 1s;
    animation-fill-mode:forwards;
    animation-delay:88s,95s;
    transform:scale(1);
    opacity:0;
    overflow:hidden;
}
.em6 img{
    height:100%;
    width:100%;
    transform:scale(1.1);
}
@keyframes emi{
    0%{
        
    }
    100%{
        opacity:1;
    }
}
@keyframes emire{
    0%{
        
    }
    100%{
        opacity:0;
    }
}