Redimensionar imagem "banner" de acordo com a tela usada.

[lordkevin 0]

Boa tarde amigos, sou novo por aqui e com desenvolvimento de sites. Em meu primeiro projeto adaptável estou enfrentando dificuldades em redimensionar a imagem de "banner" com o tamanho da tela utilizada.

Gostaria muito da ajuda de vocês.

Link do meu site: https://www.onvisual.com.br/clientes/sites/rota/index.html

Na imagem escrito Banner promocional, eu gostaria de redimensionar ela de acordo com o tamanho da tela usada pelo visualizador, porém mesmo utilizando div com width 100% não está adaptando.

Será que alguém conseguiria me ajudar?

Obrigado.

[Omar~ 87]

Primeiro que você não poderá usar 

<img src="img/BANNER.png" width="1400" height="400">

Porque tem que adaptar e essas propriedades tornam a imagem de tamanho fixo

 

Um jeito sem abranger outros recursos e sem analisar seu CSS:

No HTML:

<img src="img/BANNER.png" class="adaptavel" alt="banner"/>

No CSS:

img.adapatavel {
  max-width: 1400px;
  min-height: 400px;
  width: 100%;
  height: 100%
}

 

Só usei o recurso "inspecionar elemento" e editei seu css e html.