@media (max-width:1025px){

 
   .box{
      width: 350px;
   }
   .card{
      gap: 8px;
   }
   .header_info{
      padding-bottom: 20px;
   }
}


@media (max-width:939px) {
   .intro_img{
    width: 500px;
  
   }
   
    
}

@media (max-width:769px){
   .box{
      width: 300px;
   }
   .card{
      gap: 5px;
   }
}
@media (max-width:598px){
   .intro_img{
      width: 400px;
   }
   .header{
      width: 400px;
         }

         .nav_logo_img{
            width: 50px;
         }
         .nav_logo_title{
            font-size: 15px;
         }
         .nav_text{
            font-size: 20px;
            margin-top: 19px;
         }
         .nav__text{
            font-size: 20px;
            color: white;
            margin-top: 10px;
            margin-bottom: 30px;
         }
         .box{
            display: flex;
            gap: 10px;
            margin-top: 20px;
            margin-bottom: 5px;
         }
          .nav_link{
            background: linear-gradient(90.09deg, #3800AF 0%, #BF7204 97.52%, #C27500 100%, #C27500 100%, red 100%);
            text-decoration: none;
            color: white;
            padding: 10px;
            border-radius: 25px;
            width: 80%;
            margin-top: 0;
          }
          .by_title{
            font-size: 14px;
            color: white;
          }
}

@media(max-width:435px){
  .big{
display:flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100vh;
 }
.gif_img{
   display: none;
}
body{
   max-width: 400px;
   width: 100%;
   display: block;  
   margin: 0 auto;
}
}

@media (max-width:426px){
   .intro_img{
      width: 200px;
    
     
   }
   .header{
      width: 100%;
   }
  .nav_logo_img{
   width: 20px;
  }
  .nav_logo_title{
   font-size: 12px;
  }
  .nav_text{
   font-size: 13px;
   margin-bottom: 8px;
  }
  .nav__text{
   font-size: 10px;
 
  }
  .nav_link{
   width: 80px;
   padding: 10px;
   font-size: 8px;
  }
  .header_title{
   font-size: 11px;
  }
  .gif_img{
   width: 20px;
  }

  .card_img{
   width: 15px;
  }
  .card_text{
   font-size: 10px;
   width:50px;

  }
  .card{
   display: flex;
   position: relative;
   width: 120px;

  }
 
  .header_number{
   font-size: 10px;
  }
  .big{
   display: flex;
   flex-direction: column;
  }
  .intro_img{
   width: 100%;
   height: 300px;
   
  }
  .header_info{
   width: 250px;
   display: flex;
   align-items: center;
}
.by_title{
   font-size: 10px;


}
}
  
@media (max-width:376px){
   .header_info{
      margin-top: 10px;
    width: 300px;
   }
   .by_title{
    font-size: 14px;
   }
   .header_number{
    font-size: 15px;
 
   }

}
@media (max-width:321px){
   .intro_img{
      width: 200px;
      height: 100px;
    
     
   }
   .header{
      width: 100%;
   }
  .nav_logo_img{
   width: 20px;
  }
  .nav_logo_title{
   font-size: 12px;
  }
  .nav_text{
   font-size: 13px;
   margin-bottom: 8px;
  }
  .nav__text{
   font-size: 10px;
 
  }
  .nav_link{
   width: 80px;
   padding: 10px;
   font-size: 8px;
  }
  .header_title{
   font-size: 11px;
  }
  .gif_img{
   width: 20px;
  }

  .card_img{
   width: 15px;
  }
  .card_text{
   font-size: 10px;
   width:50px;

  }
  .card{
   display: flex;
   position: relative;
   width: 90px;

  }
 
  .header_number{
   font-size: 10px;
  }
  .big{
   display: flex;
   flex-direction: column;
  }
  .intro_img{
   width: 100%;
   height: 300px;
   
  }
  .header_info{
   width: 208px;
   display: flex;
   align-items: center;
}
.by_title{
   font-size: 9px;


}
}