.contain{
            height: 100vh;
            width:90vh;
        }

      .tp{

        height:25vh;
        width:100vw;
        color:snow;
        display: flex;
 
        align-items: center;
        vertical-align:middle;
      }
         
  .logo-contain{
      
      width:99vw,auto;
      margin: 0  auto; 
  }  
    .logo-image{
    vertical-align:middle;
    width: 11vw;
    height: auto; 
  }
.logo-text{
    font-size: 4.5vw ;
    color:aqua;
    text-shadow: 3px 5px 1px rgba(245, 245, 245, 0.5);
    text-align: center;
    margin: 0 auto; 
    vertical-align:middle;
 

}

.logo-add{
    font-size: 1.5rem;
    color:rgb(169, 170, 225);
    display: block;
    text-align: center;
    margin: 0 auto;
    position: relative;

}
 .devinfo{
    vertical-align:bottom;
     text-align:end;
     font-size: 1.8rem;
     color: rgba(200, 200, 200, 1) ;
     
     
 }
 

.bt{
    display:block;
    text-align: bottom;
    color:white;

}

        html, body { 
           
           color:rgba(5, 10,5,.9);
           background-image: linear-gradient(#0a0000, #9198e5);
           font-family: Arial;
           overflow: hidden;
         
        }
          .text-container {
           background-image: linear-gradient(#e66465, #118aaf);
           width: 125vw;
           height: 80vh;
           font-weight: bold;
           font-size: 2rem;
           position:absolute;
           overflow: hidden;
       
       }

       @media (min-width:800px)  { 
        .text-container {
            background-image: linear-gradient(#e66465, #6be16b);
            width: 125vw;
            height: 80vh;
            font-weight: bold;
            font-size: 2.5rem;
            }

       }
       @media (min-width:1280px)  { 
        .text-container {
            background-image: linear-gradient(#e66465, #d5ea77);
            width: 125vw;
            height: 80vh;
            font-weight: bold;
            font-size: 2.5rem;
            }

       }
       




       .text-container > div {
           animation: flow linear 25s infinite;
           opacity:0;
           transform-origin: center center;
           width: 30vw;
           height: 30vh;
            position: absolute;
           backface-visibility: hidden;
       }
       
       .text-container > div:nth-child(1) {
           left: 30vw;
           top: 30vh;
           animation-delay: 0s;
       }
       
       .text-container > div:nth-child(2) {
           left: 40vw;
           top: 20vh;
           animation-delay: 8s;
       }
       
       .text-container > div:nth-child(3) {
           left: 50vw;
           top: 30vh;
           animation-delay: 16s;
                                                                                                                                                                                                                                                                                    
       }
       
       .text-container > div:nth-child(4) {
           left: 40vw;
           top: 20vh;
           animation-delay:  24s;
       }
       
       .text-container > div:nth-child(5) {
           left: 50vw;
           top: 50vh;
           animation-delay: 32s;
       }
       .text-container > div:nth-child(6) {
           left: 30vw;
           top: 30vh;
           animation-delay: 40s;
       }
       
       
       @keyframes flow {
           0% {
               transform: scale3d(0,0,1) rotate(0.02deg);
               opacity: 0;
               filter: blur(10px);
           }
           25% {
               transform: scale3d(1,1,1) rotate(0.02deg);
               opacity: 1;
               filter: blur(0px);
           }
           40% {
               opacity: 1;
               filter: blur(0px);
           }
       
           80% {
             opacity: 0;
           }
         
           100% {
               transform: scale3d(4,4,1) rotate(0.02deg);
               filter: blur(10px);
           }
       }