.file {
    align-items: center;
    background-color: var(--gray-600);
    border: 1px solid var(--gray-200);
    color: var(--dark);
    cursor: pointer;
    display: inline-flex;
    font-size: 16px;
    height: 40px;
    padding: 0 20px;
    position: relative;
}

@media (min-width: 992px) {
  .file {
    font-size: 18px;
  }
}

.file-input {
  cursor: pointer;
  display: block;
  height: 100%;
  left: 0;
  opacity: 0;
  padding: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.file:hover,
.file:focus {
  box-shadow: 0px 0 4px var(--gray-200);
}