input {
    color: #fff;
    font-size: 20px;
    border: 5px solid #8707ff;
    border-radius: 10px;
    padding: 10px 25px;
    background: transparent;
    max-width: 100%;
    transition: 1s;
    width: 50%;
   }
   
   .input:active {
    box-shadow: 2px 2px 15px #8707ff inset;
   }
  
   [type="search"]::-webkit-search-cancel-button {
    -webkit-appearance: none;
    background-color:red;
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23777'><path d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/></svg>");
    background-size: 30px 30px;
    height: 45px;
    width: 45px;
}

   
   
  #btnSearch{
    background-color: #269cb5;
    color: #fff;
    transition: 0.2s;
    height: 3rem;
    margin-bottom: 13px;
    
   }
   #btn:hover{
    background-color: #11849b;
   }