.header {
    background-color: #45646C;
}

.header__img {
    height: 300px;
    background-image: url("../../img/header.PNG");
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

.header__overlay {
    width: 100%;
    text-align: center;
}

.header__overlay-text {
    color: #FFFFFF;
    padding: 10px 0;
}

@media screen and (min-width: 992px) {

  .header__img {
    height: 400px;
  }

  .header__overlay-text {
    float: right;
    background-color: rgba(57,69,72,0.8);
    padding: 10px;
  }

  .header .container {
    margin-top: -130px;
    margin-bottom: 50px;
  }

}

@media screen and (min-width: 1200px)  {
  .header__img {
    height: 500px;
  }
}