*{padding: 0;
    margin: 0;}
    body{
        background-color: black;
        height: auto;
    }


    header
    {        position: fixed;

       width: 100%;
    height: 100px;
  display: flex;

align-content: center;
text-align: center;
justify-content: space-between;
}
    

    .but1 {
        margin: 20px;
        height: 45px;
        width: 100px;
        display: flex;
        justify-content: center;
        align-items: center;
        align-self: center;
        text-align: center;
        flex-wrap: nowrap;
        flex-direction: column;
        border-style: none;
        background-color: rgba(255, 255, 255, 0.151);
        transition-duration: 0.5s;
        font-size: 15px;
        font-family: arial;
        list-style-type: none;
        text-decoration: none;
        border-radius: 0px;
        border-style: none;
        border-radius: 0 !important;
            outline: 0px solid transparent;
      }
      
      
      .a1 { list-style-type: none;
        text-decoration: none;
        color: black;}
      
        .a1:hover { list-style-type: none;
            text-decoration: none;
            color: black;}
            
      
      
      
            .but1:hover {        text-decoration: none;
                list-style-type: none;
                background-color: white;
                color: rgba(255, 255, 255, 0.4);
            
            }
      
      .container{
          width: 100%;
 
          height: 100vh;
       }
      .firstdiv{
 width: 100%;
height: 250px;
display: flex;
text-align: center;
align-items: center;
align-content: center;
flex-direction: center;
justify-content: center;
align-self: center;
 

      }
      .th1{color: white;
           font-size: 50px;
          text-transform: uppercase;
          padding-top: 50px;
      }
      .th1s{color: white;
        font-size: 50px;
       text-transform: uppercase;
       padding-top: 50px;
 
    }

      .info{
          width: 100%;
          height: 100vh;
          
           background-image: url(cover1.png);
         background-size: cover;
         background-repeat: no-repeat;
          display: flex;
          flex-direction: row;
          justify-content: flex-start;
          align-self: center;
          justify-self: center;
          justify-content: center;
          align-items: center;
          align-content: center;
          text-align: center;

           

      }

.image3{
  display: flex;
   background-color: rgba(0, 0, 0, 0.541);
  flex-direction: row;
  align-items: center;
  align-content: center;
  align-self: center;
  width: 50%;
  height: 50%;
  justify-content: center;
}
.medals{  filter: blur(8px);

  width: 200px;
}
.medals:hover{ 
  filter:none;

  width: 210px;
}

      .info2{
        width: 100%;
        height: 100vh;
        
         background-image: url(cover2.png);
         background-position: center;
         
       background-size: cover;
       background-repeat: no-repeat;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-self: center;
        justify-self: center;
        justify-content: center;
        align-items: center;
        align-content: center;
        text-align: center;
       


    }
     
      
    p{
      font-size: 25px;
      margin: 10px;
      padding: 10px;

  }
    
    .gif{
         width: 10%;    

         height: 20%;
         top: 10;

         right: 0;
     
         left: 0;
     
     }
     

     .scroll-downs {
      z-index:+1;
      position: absolute;
      top: 10;
      right: 0;
      bottom: 40px;
      left: 0;
      margin: auto;
      
      width :34px;
      height: 55px;
    }
    .mousey {
      width: 3px;
      padding: 10px 15px;
      height: 35px;
      border: 2px solid #fff;
      border-radius: 25px;
      opacity: 0.75;
      box-sizing: content-box;
    }
    .scroller {
      width: 3px;
      height: 10px;
      border-radius: 25%;
      background-color: #fff;
      animation-name: scroll;
      animation-duration: 2.2s;
      animation-timing-function: cubic-bezier(.15,.41,.69,.94);
      animation-iteration-count: infinite;
    }
    @keyframes scroll {
      0% { opacity: 0; }
      10% { transform: translateY(0); opacity: 1; }
      100% { transform: translateY(15px); opacity: 0;}
    }
  

.bottom{
   z-index:+1;
    position: absolute;
    top: 10;
    right: 0;
    bottom: 40px;
    left: 0;
    margin: auto;
    
    

}

    .containerow{
      margin-top: 150px;
        width: 100%;
        height: 100vh;
     }
     .gotop{
        position: fixed;
        width: 50px;
        height: 50px;
        bottom: 40px;
        right: 50px;
      }
      .gotop:hover{
        width: 60px;
        height: 60px;
        transition: 0.1s;
        padding-right: -10;
        margin-right: -10;
      }
     .maininner{
        width: 100%;
        height: 100vh;
        margin-top: 50px;

         background-image: url(cover3.png);
         background-position: center;
        background-size: cover;
       background-repeat: no-repeat;
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-self: center;
        justify-self: center;
        justify-content: center;
        align-items: center;
        align-content: center;
        text-align: center;
       


    }

    .firstdiv{
        width: 100%;
        height: 250px;
        display: flex;
        text-align: center;
        align-items: center;
        align-content: center;
        flex-direction: center;
        justify-content: center;
        align-self: center;
         


    }
    

    .inforow{
        width: 100%;
        height: 100vh;
        
         background-image: url(cover3.png);
       background-size: cover;
       background-repeat: no-repeat;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-self: center;
        justify-self: center;
        justify-content: center;
        align-items: center;
        align-content: center;
        text-align: center;
       


    }
 
    .text{ 
        display: flex;
        flex-direction: column;
        text-align: center;
         width: 100%;
         display: flex;
        height: 100vh;
        align-self: center;
        justify-self: flex-start;
        align-items:center;
        align-content: center;
         color: white;
          
    }
    
    

  
  
  @media only screen and (max-width: 768px   ) {
  
   p{
     font-size: 20px;
   }
    .gotop{
      display: none;
    }
.th1{
  font-size: 35px;
}
.th1s{
  font-size: 25px;
}







    }
    @media only screen and (max-width: 768px   ) {
    
      .mousey{
        display: none;
        
      } 
     .gotop{
       display: none;
     }
    }
    @media only screen and (max-width: 425px   ) {
    
   .mousey{
     display: none;
     
   } 
  .gotop{
    display: none;
  }
.medals{  width: 100px;
}

  }
  @media only screen and (max-width: 768px   ) {
    .th1s{
      padding-top: 20px;
    }



  }

    @media only screen and (max-width: 425px   ) {


     p{   overflow: scroll;

        scroll-behavior: smooth;
      right: 0;
      left: 0;
      }

      @keyframes scroll {
        0% { opacity: 0; }
        10% { transform: translateY(0); opacity: 1; }
        100% { transform: translateY(15px); opacity: 0;}
      }
       
      ::-webkit-scrollbar {
        display: none;
      }
      ::-moz-scrollbar {
        display: none;
      }
      ::-o-scrollbar {
        display: none;
      }.scroll-downs {
        z-index:+1;
        position: absolute;
        top: 10;
        right: 0;
        bottom: 350px;
        left: 90%;
        margin: auto;
        
        width :34px;
        height: 55px;
      }
  
      p{
        font-size: 15px;
      }
       .gotop{
         display: none;
       }
   .th1{
     font-size: 25px;
   }
   
   .th1s{
    font-size: 25px;
  }
   
   
   
   
   
   
       }

       @media only screen and (max-width: 1440px   ) {
         p{
font-size: 20px;


         }
       }