*{
  margin:0px;
  padding:0px;
}
  body{
    width:100vw;
    height:100vh;
  }
  .main{
    width:100%;
    height:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:20px;
  }
  .btns{
    width:95%;
    padding:2%;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    display:flex;
    flex-wrap:wrap;
    gap:15px;
    align-items:center;
  }
  .obtn {
      width: 60px;
      height: 60px;
      border: none;
      border-radius: 50%;
      text-align: center;
      background: #f0f0f0;
      cursor: pointer;
      transition: all 0.2s ease;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow:hidden;
    }
    .np:hover{
      background:#006BFF;
    }
     .text-box {
      vertical-align: top;
      height: 75%;
      width: 93%;
      padding: 2.5%;
      font-size: 18px;
      font-family: sans-serif;
      resize: none;
      outline: none;
      border: 0.5px solid #ccc;
      border-radius: 10px;
      background: #ffffff;
      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
      overflow-y: auto;
    }
    .btns select{
      max-width:100px;
      height:30px;
    }
    .btn-downlode{
      min-width:120px;
      color:#006BFF;
      border:none;
      height:60px;
      display:flex;
      align-items:center;
      justify-content:center;
      background:transparent;
      font-size:18px;
      gap:5px;
      overflow:hidden;
    }
 @media (max-width: 480px) {
   .btns{
     gap:10px;
     padding-left:20px;
     width:90%;
   }
   .btns button{
     width:40px;
     height:40px;
     font-size:15px;
   }
   .btns button i{
     font-size:15px;
   }
   .text-box{
     width:95%;
   }
   .btn-downlode{
     margin-left:-15px;
   }
 }