WordPress Header background image not responsive and center

I am using this Wordpress Theme for my website and I have tried to set center or full-width image header, but it's not working. Image is always left, I want to know how to do that correctly ,(Theme are not provided header to add image option )

This is my CSS

#header .header__top.bg-cat-1 {
  background: url("http://localhost/pro/wp-content/uploads/2018/01/HD.png");
  background-repeat:no-repeat;
  align-content:center;
}

Solution

Try to make use of background-position: center center.

The background-position CSS property sets the initial position for each defined background image, relative to the background position layer defined by background-origin.

Default value of background-position is 0% 0% thats why its starts from top-left corner by default.

#header .header__top.bg-cat-1 {
  background-image: url("http://localhost/pro/wp-content/uploads/2018/01/HD.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

Reference Link:

background-position