Why are styles not being applied (flexbox)?

Question

css

<div class = "wrapper">
  <input class = "input"/>
  <button class = "button"></button>
</div>

Please tell me, I don’t know flex very well, and I don’t understand why this behavior (...
1. I set the wrapper class to display: flex, my input and the button become in a row, then I style the input - styles are applied, but not applied on the button ( ((

.wrapper {
  display: flex;
}

.input {
  height: 25px;
  width: 300px;
  border: 1px solid #cecece;
  border-radius: 6px;
  outline: none;
  padding: 2px 5px;
  font-size: 15px;
};

.button {
  height: 25px;
  width: 120px;
  background-color: red;
  margin-left: 40px;
  cursor: pointer;
};

Answer 1

The rule in CSS closes without a semicolon:

.class {
   color: #fff;
} /* Тут не надо точки с запятой, точнее, он тут запрещен, ибо он будет всё ломать в последующем правиле */

Actually, because of this, your button was not painted. All styles are applied if you fix the error:
Another mistake. This is not possible:
This is how it should be:
<div class="wrapper"></div>