.container_button {
  position: relative;
  --size-button: 40px;
  width: 20%;
}

.input {
  padding-left: var(--size-button);
  height: var(--size-button);
  font-size: 15px;
  border: none;
  color: #111111;
  outline: none;
  width: 100%;
  transition: all ease 0.3s;
  background-color: white;
  box-shadow: 1.5px 1.5px 3px #eaeaea,
    -1.5px -1.5px 3px rgba(206, 196, 196, 0.25), inset 0px 0px 0px #eaeaea,
    inset 0px -0px 0px #eaeaea;
  border-radius: 50px;
}

/*   .input:focus,
  .input:not(:invalid) {
    width: 200px;
    cursor: text;
    box-shadow: 0px 0px 0px #eaeaea, 0px 0px 0px rgba(223, 217, 217, 0.25), inset 1.5px 1.5px 3px #eaeaea, inset -1.5px -1.5px 3px #eaeaea;
  }
  
  .input:focus + .icon,
  .input:not(:invalid) + .icon {
    pointer-events: all;
    cursor: pointer;
  } */

.container_button .icon {
  position: absolute;
  width: var(--size-button);
  height: var(--size-button);
  top: 5px;
  left: 5px;
  padding: 8px;
  pointer-events: none;
}

.container_button .icon svg {
  width: 100%;
  height: 100%;
}
/**----------*/

.container_button_dos {
  position: relative;
  --size-button: 40px;
  width: 15%;
}

.input_dos {
  padding-left: var(--size-button);
  height: var(--size-button);
  font-size: 15px;
  border: none;
  color: #111111;
  outline: none;
  width: var(--size-button);
  transition: all ease 0.3s;
  background-color: white;
  box-shadow: 1.5px 1.5px 3px #eaeaea,
    -1.5px -1.5px 3px rgba(206, 196, 196, 0.25), inset 0px 0px 0px #eaeaea,
    inset 0px -0px 0px #eaeaea;
  border-radius: 50px;
  cursor: pointer;
  width: 100%;
}

/*   .input:focus,
  .input:not(:invalid) {
    width: 200px;
    cursor: text;
    box-shadow: 0px 0px 0px #eaeaea, 0px 0px 0px rgba(223, 217, 217, 0.25), inset 1.5px 1.5px 3px #eaeaea, inset -1.5px -1.5px 3px #eaeaea;
  }
  
  .input:focus + .icon,
  .input:not(:invalid) + .icon {
    pointer-events: all;
    cursor: pointer;
  } */

.container_button_dos .icon {
  position: absolute;
  width: var(--size-button);
  height: var(--size-button);
  top: 5px;
  left: 5px;
  padding: 8px;
  pointer-events: none;
}

.container_button_dos .icon svg {
  width: 100%;
  height: 100%;
}

@media only screen and (max-width: 992px) {
  .container_button {
    width: 75%;
    margin-left: 1rem;
  }
}

@media only screen and (min-width: 993px) and (max-width: 1420px) {
  .menu-item {
    font-size: 13px;
  }
  .container_button {
    width: 15%;
    margin-right: 1%;
  }

  .container_button_dos {
    width: 10%;
    margin-right: 1%;
  }
}
/* ------------------- */