When I zoom my page in and out it works, but homepage button loses its color, it doesn't expand to the right side.
So I have 2 aims:

1) To center selected area (on the picture allotted by red color).

2) To have homepage's green color expanded to the right to the end of the page.

Sorry for my English. Ask me if I didn't make the question clear.

[what I'm trying to do](https://i.stack.imgur.com/que14.jpg)

[what I have](https://i.stack.imgur.com/wfqje.png)

[what makes me cry](https://i.stack.imgur.com/Q1Kyo.png)

HTML Code

```
<!DOCTYPE html>
<html>
  <head>
    <title>Infusion</title>
    <link rel="stylesheet" type="text/css" href="infusion.css">
    <meta charset="utf-8"/>
    <link href="https://fonts.googleapis.com/css?family=Hind" rel="stylesheet">
  </head>
  <body>
    <div class="navbar">
      <ul class="unlist">
        <a href="#"><li class="homepage"><p class="parhome">infusion</p></li></a>
        <a href="#"><li class="nav-elements">design folio</li></a>
        <a href="#"><li class="nav-elements">services</li></a>
        <a href="#"><li class="nav-elements">our business</li></a>
        <a href="#"><li class="nav-elements">how we help</li></a>
        <a href="#"><li class="nav-elements">take the tour</li></a>
        <a href="#"><li class="nav-elements">contact</li></a>
      </ul>
    </div>
  </body>
</html>

```

CSS Code

```
body, html {
  margin: 0;
  padding: 0;
}
.navbar {
  width: 2000px;
  margin: 0 auto;
}
.unlist {
  display: flex;
  margin: 0;
  padding: 0;
}
.homepage {
  background-color: #63C6AE;
  display: inline-block;
  list-style: none;
  width: 360px;
  height: 70px;
  color: white;
  font-size: 25px;
  text-align: right;
  vertical-align: middle;
  line-height: 75px;
}
.parhome {
  height: 50px;
  padding: 0;
  margin-right: 30px;
  margin-bottom: 0;
  margin-top: 0;
}
.parhome:hover {
  color: #586165;
}
.unlist.a:first-child {
  width: 148px;
}
.nav-elements {
  display: inline-block;
  list-style: none;
  height: 70px;
  padding-right: 25px;
  padding-left: 25px;
  text-align: center;
  vertical-align: middle;
  line-height: 70px;

}
.unlist a {
  text-decoration: none;
  color: #63C6AE;
  text-transform: uppercase;
  font-family: 'Hind', sans-serif;
  font-weight: bold;
}
.inlist, a:hover {
  color: #586165;
}

```